HTML01

HTML总结

开发工具
Google Chrome
Visual Studio Code
Photoshop

（Dw：控件拖动；webStrom：有收费版；Sublime：简洁）

HTML(HyperText Markup Language)超文本标记语言
CSS（Cascading Style Sheet）级联样式表

五大浏览器及内核
IE浏览器
Trident
火狐浏览器（Firefox）
Gecko
谷歌浏览器（Chrome）
Blink (Webkit的一个分支) Webkit
苹果浏览器（Safari）
Webkit
欧朋浏览器（Opera）
Blink

Web 标准
结构标准
HTML 标准
表现标准
CSS标准
行为标准
javascript标准

操作汇总

骨架结构
HTML标签：作用所有HTML中标签的一个根节点，根标签。
head标签：文档头部（描述文档的各种属性和信息，包含文档的标题、在Web
中的位置以及其他文档的关系等；其中必须设置的标签是title）；
title标签：文档的标题（让页面拥有属于自己的标题）；
body标签：文档的主体（包含文档的所有内容）；

标签语法
双标签
语法：<标签名>…</标签名>
例如：title标签，head标签，body标签；
单标签（也称空标签，指一个标签符号即可完整地描述某个功能的标签）
语法：<标签名/>
例如：meta/ ；br/ ；hr/ ；

标签关系
并列关系
例如head和body平级关系，都在同一个html标签中；
嵌套关系
例如html中嵌套了head标签（建议使用table键区分）；

标题标签
head的缩写 h ；分为1-6 六个级别；

标题

段落标签

内容

表示一个段落；

盒子标签
页面布局主要的两个盒子：css+div；
div就是divsion的缩写，分割、分区的意思；

span，跨度、跨距；

文本表现标签
或 粗体显示
或 斜体显示
或 加删除线显示
或 加下划线显示
b i s u 只有使用，没有强调意思； strong em del ins 语义强烈；

图片标签
标签属性
语法：<标签名 属性值1 = “值” 属性值2 = “值”>内容</标签名>
标签可用拥有多个属性，必须写在开始标签中，位于标签名后；
属性不分先后顺序，标签名与属性、属性与属性之间均以空格分开；
任何标签的属性都有默认值，省略该属性则取默认值；

图片标签的使用
属性 属性值 描述
src URL 图像的路径
alt 文本 图像不能显示时的替换文本
title 文本 鼠标悬停显示的内容
width 像素 图像宽度
height 像素 图像高度
border 数字 图像边框的宽度

路径
相对路径
图像文件和HTML文件位于同一级文件夹；下一级用 / ；上一级用 …/ ;
绝对路径
完整的网络地址

超链接标签
标签属性
文本或者图像
target的属性值：
self 当前窗口打开；
_blank 新窗口打开；
title：鼠标悬停提示文字

外部链接需要添加全域名路径，比如http://www.baidu.com
内部链接直接链接内部页面名称即可，#表示空连接

base标签
位于head标签中，可以指定页面中所有a 标签的跳转方式

锚点
页面内容较多时，可以通过锚点快速到达指定位置；
例如：回到顶端；
使用 标题
例如：
使用相应的id跳转到指定位置

内容

实体字符
特殊字符 描述 字符代码
空格  
< 小于 <

大于 >
& 和号 &
￥ 人民币 ¥
© 版权 ©
® 注册商标 ®
° 摄氏度 °
± 正负号 ±
× 乘号 ×
÷ 除号 ÷
² 平方 ²
³ 立方 ³

列表
容器里装载着文字或者图标的一种形式；
特点：整齐、整洁、有序；

无序列表

中只能嵌套

• 直接输入其他标签或者文字是不允许的
• 之间相当于一个容器，容纳所有的元素 带有自己的样式属性

  有序列表

  自定义列表