html基础知识（1）

Html+css

html: HyperText Markup Language 超文本标记语言 定义文档结构

css: Cascading Style Sheets 层叠样式表 定义样式类型（外观）

页面表示基础、可以控制布局、控制页面渲染

html术语

注释

<!-- 注释内容 --> 

用于描述（说明）代码功能。浏览器不会解析和显示

元素：

构成网页的基础单位。网页由大量的元素组成。

元素组成：

<开始标签>元素内容</结束标签>

属性是对元素附加的功能。

元素分类： 双标签和单标签

元素的嵌套：父元素、子元素、兄弟元素、后代元素

文档声明 DOCTYPE

未声明将以低版本的html协议进行解析。也叫怪异模式

html lang属性

head 头标签 用于描绘网页的附加信息

• meta 标签 用于标示 其他源数据 （charset、keywords、viewport、author）
• link 标签 用于连接其他文件（css）
• script 标签 用于连接其他文件（css）或者头部内嵌javascript。
• style 标签 用于书写头部样式。
• title 标签 网页标题。

body 元素

网页主体 即网页显示内容

css引用

分类

1. 内部样式
   head中的style标签，直接将css样式写在html的头部
2. 外部样式
   将css写在单独的css文件中，用link标签引用
3. 行间样式
   写在标签的开始标签中，用于单个标签修改样式

建议使用外部样式，利于复用和维护

权重:行内样式权重最大，head中的位置决定了内部和外部样式的权重

术语

1. 注释
   用于描述代码的功能

       /* 注释 */

2. 规则
   1. 选择器
      1. 元素选择器：同一元素应用
      2. 类选择器：所有匹配的类都应用
      3. id选择器：唯一匹配的元素应用
   2. 命名规则：

html语义化

html5中新增的元素，与div相同的作用 但是能直接体现出意义

html语义结构化元素

• header 头部
• nav 导航
• aside 侧边栏
• ariticle 文章
• section 一个整体或者一个部分
• footer 底部

html 元素

a 元素

链接标签

属性：href url  target 打开链接的方式

作用： 

• 跳转到新的页面
• 锚点功能
• 功能链接（tel、mailto），调用系统软件实现的功能。