html的初学之路

web结构的组成

• html：超文本标记语言

• css： 层叠样式表 美化页面

• javascript：轻量级的脚本编程语言（行为和动态）

html标签规则

• 关键字由 尖括号包裹

• 成对出现，由开始标签和结束标签组成（结束标签多一个反斜杠/） 

例：

段落

基本上都是双标签，但是还有一类比较特殊，叫“单标签”、“自闭和标签”、“空标签”

快速生成一个html

• 新建一个xx.html的文件

• 输入法 调到英文状态下

• 在编辑区输入感叹号 ！+enter

html的基本结构

       

展示内容

标签的关系

• 包含

• 并列

标签

标题标签

标题标签可以分为六级，从h1-h6，从表象上看：粗细相同，都是加粗的，字号逐次递减；从优化程度上来说，重要程度也是逐次递减，h1一般用在logo的部分

一级标题

二级标题

三级标题

四级标题

五级标题

六级标题

段落

段落

图片

• src：图片地址

• alt：图片加载失败 出现代替文字

• title：鼠标滑上，会出现跟随文字

超链接 a

• target：

○ _self ：当前窗口打开

○ _blank：在新窗口打开

属性

描述一定的特征和功能的就是属性，属性可以分为内置属性和自定义属性，

• 一个标签的属性是可以有多个的

• 属性与属性之间需要有 空格

• 没有顺序关系

回到顶部

重新加载

回到目的id位置

禁止跳转

字符实体

字符实体有字符编号和字符名称

新增的标签

1）iframe

内嵌网页

2）div

大盒子标签，用来划分区域（块级元素）

3）spam

小盒子标签，用来划分小区域（行内元素）

4）格式化标签

标签自带一定的样式

• 斜体： i、em

• 加粗 ：b、strong

• 删除线：s、del

• 下划线：ins 、u

i/em都表示斜体，b、strong表象上都是加粗，从优化程度上，em和strong(语义化更强烈一些)要比i、b更重要

5)预格式化标签 pre

会安装编辑区里面预先设置好的格式显示在页面上

预格式化标签

 

 
 
***    ***
 
 
（）  （）
 
 
***
 
 

音频 audio/视频video

+ src 资源路径

+ controls控制器

+ loop 循环播放

+ autoplay 自动播放

三大列表

注意：三大列表都是固定样式，ul 和ol里面紧邻着一定式li，如果需要其他标签，可以放到li里面。dl里面紧邻着一定式dt和dd，如果需要其他标签，可以放到dt dd里面

无序列表

ul li 都是固定样式

• 最新动态：come on baby
• 最新动态：come on baby
• 最新动态：come on baby
• 最新动态：come on baby

有序列表

1. 1  最新动态：come on baby
2. 2 最新动态：come on baby

无序列表

关于我们

官网

备站

联系

答疑

故事