资讯专栏INFORMATION COLUMN

从零开始的全栈工程师——html篇1

sydMobile / 1050人阅读

摘要:全栈工程师也可以叫前端主要是网站小程序公众号这一块隶书篇超文本标记语言,标记通用标记语言下的一个应用。超文本标记语言的结构包括头部分英语和主体部分英语,其中头部提供关于网页的信息,主体部分提供网页的具体内容。

全栈工程师也可以叫web 前端 H5主要是网站 app 小程序 公众号这一块

HTML篇

html(超文本标记语言,标记通用标记语言下的一个应用。)

“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。

超文本标记语言的结构包括“头”部分(英语:Head)、和“主体”部分(英语:Body),其中“头”部提供关于网页的信息,“主体”部分提供网页的具体内容。

测试浏览器为chrome(谷歌)浏览器 当然其他浏览器也可以 不过最好用谷歌

开发工具有记事本  Sublime  dreamwear webstorm  hbulider 我们这里用hbulider来介绍

 

 

一.网页是由什么构成的

title 主题,题目,

Url 网址

Body 网站内容

 

 

二.标签

标签分为双标签和单标签 单标签也叫空标签 

结构为单标签:<单标签/>   

           双标签:<双标签开始>

单标签举例:(插图片用的标签)

双标签举例:

(段落标签)

 

 

三.网页的骨架

 

 

四.标签的属性

这里用图片标签来解释一下<标签名 属性=“属性值”/>

 

 

五.常用的标签

双标签 html  title  head  body  h1-h6  p  a 

b(加粗标签)strong被H5舍弃了  i 倾斜标签  sup 上标标签  sub 下标标签

em(小图标的)div 盒子标签  span 内敛标签  表格 列表 等标签

单标签   


(分割线)  
(换行)  (网页元信息)

注释:Html特有的注释 

 

1.插图片用的标签:

img:(插图片用的标签)

Src 是指图片的路径

图片的资源分为本地资源或网络资源

本地资源:就是自己保存的图片

网络资源:在网站上的图片

 

2.超链接

a:(超链接)

a有两个属性 一个是 href  属性值为 需要跳转的页面地址比如(http://www.baidu.com)或者本地页面地址

另一个是target属性值为 跳转页面打开的方式 常用的两个属性值为 _blank(在一个新的网页打开 ) 或  _self(默认的)

 

3.起名方式

1)标签名

2)id起的  使用的时候加#

3)class类 使用的时候加.

起名的目的就是为了给他添加样式  style  其实也是属性

属性:代表事物的一些特征,比如 width height color background 等

 

4.style用法

书写规范 {} 是shift+[ 出来 {}

起名规范  不能用汉字起 第一个字母不能是特殊符号 第一个字母必须是英文字母

 

5.表格标签

Border 是决定边框粗细的属性

cellspacing 是单元格空间的属性 

cellpadding 是单元格内部的边距的属性。

表格的行:   列:

比如插入一个像这样

 

的表格

就是三个在每个中间插三个

 

 

Img插入table中

会发现出现余白,怎么解决?

colspan  水平合并单元格的个数

rowspan  垂直合并单元格的个数

 

案例

表格中插入表格

图:

思路:插入一个三行三列600X600的表格  合并1 2 3在123中插入一个两行六列的表格

答案:

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/1835.html

相关文章

  • 从零开始全栈程师——html1.2

    摘要:权重行内样式把当做标签来用写在之间外部引用把当做文件来用在里加一条路径这里的可以舍去因为后面的文件名是会默认这条标签是和是必不可少的。嵌入式这个前期一般用不到就是一个样式表里引入另一个的样式表起名方式与CSS 一.起名方式(起名方式也叫选择器) 起名的目的是为了给标签添加属性 常见的3种选择器有 标签选择器   id选择器(使用的时候加#)    class选择器(使用的时候加.)  样式的...

    saucxs 评论0 收藏0
  • 从零开始全栈程师——html1.4

    摘要:背景与边框一背景背景颜色简写备注以下给设置可能不起作用需要用到背景图片简写背景图片的平铺平铺浏览器默认平铺只平铺横向和纵向不平铺背景大小与位置大小大小属性值的写法有具体设置大小自适应位置背景位置也是坐标轴向下为正像右为背景与边框        一、背景(backgound) 1.背景颜色:background-color:red;(简写:background:color;) 备注:ie9以下...

    yedf 评论0 收藏0
  • 从零开始全栈程师——html1.7

    摘要:存在形影分离,所以一般情况下不建议添加值了,一般给子元素当参照位置,或者是元素的微调。实际上,这是属性的特点。表单的内元素文本框密码框单选框多选框普通按钮按钮提交按钮提交下拉列表position定位与表单 一、position 1、Position细说 Position:relative; Left:100px; Top:100px; Position:absolute; Left:100p...

    Dean 评论0 收藏0
  • 从零开始全栈程师——html1.3

    摘要:文本字体样式与前期英语单词汇总一文本样式颜色文本对齐方式左对齐居中对齐右对齐两端对齐文本修饰空上划线下划线删除线文本缩进缩进二字体样式字体大小大小字体颜色注意不要写成字体形状这个了解一下就行一般用不到字体字形微软雅黑宋体楷文本、字体css样式与前期英语单词汇总 一、文本样式(text)   1.颜色:color:red;   2.文本对齐方式:text-align:left/center/r...

    ingood 评论0 收藏0
  • 从零开始全栈程师——html1.5

    摘要:列表与边距探讨和行块一列表无序列表内部必须有子标签天生自带内外边距也是自带大家会发现用的时候内容前面会出现一个像这样的一个实心圆可以用属性去掉也可以更换空心圆实心圆正方形空有序列表内部必须有子标签天生自带内外边距属性是标签属性只能写在行列表与边距探讨和行块 一、列表 1.无序列表(UL) 1)内部必须有子标签2)天生自带内外边距 p也是自带 大家会发现用UL的时候内容前面会出现一个像这样的一...

    booster 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<