1.默写Html的文档结构
<!DOCTYPE html><!--声明文档类型为HTML5--><html><!--根元素所有html的文档内容都要写这标签中--><head><!--头元素，提供给浏览器和搜索引擎使用，用来描述文档的字符编码集，视口大小比如<meta charset="UTF-8">用来通知浏览器HTML文档的编写语言所属的编码集是‘UTF-8'--><head><titlle><!--显示在浏览器标签上的文本，指定当前页面的标题--></tittle><body><!--页面的主体内容，允许或希望用户的内容都应该写到这里，用户也只对这里感兴趣--></body></html>
HTML的元素HTML的元素
| 元素类型 | 标签类型 | 语法 | 实例 |
|---|---|---|---|
| 非空元素 | 双标签 | <起始标签 属性1 属性2…>元素内容</结束标签> | <p>学习让我强大</p> |
| 空元素 | 单标签 | <标签 属性1 属性2..> | img src="imgges/girl.jpg" alt="女生" |
2.HTML的三大属性
a.id属性(id属性要保证其唯一性，用来专用于获取唯一元素)
b.class属性（class为类属性，用来获取一类元素)
c.style内联属性（style也叫内联样式仅适用于当前元素）
元素的三大属性优先级元素的三大属性优先级
style属性>id属性>style属性
3.css和js中的选择器
1.css选择器
<!DOCTYPE html><html><head><style>/* 通过标签名称设置样式 */p {color: red}/* 通过class属性设置样式 */.p-class{color: red}/* 通过id属性设置样式 */#p-id{color: red}</style></head><tittle></tittle><body><p id="p-id" class="p-class">PHP中文网</p></body></html>
id>class>标签（CSS选择器的优先级）
2.js选择器
- let用来定义变量
- const用来定义常量（定义后常量无法改变）
var定义变量和let区别在于可以全局作用，let只能在声明块内有效
<!DOCTYPE><html><head></head><tittle></tittle><body><h2 id="h2-id" class="h2-class">PHP中文网</h2><body><script>// 通过标签选择let h2 = document.ElementsByTagName("h2")// 通过ID选择let h2 = document.ElementById("h2-id")// 通过class类名选择let h2 = document.ElementsByClassName("h2-class")// 通过CSS样式选择，let h2 = document.querySelector("#h2-id")// document.querSelector获取符合条件的第一个元素// document.querySelectorAll获取符合条件的所有元素</scrtpt></html>
总结
1.了解了html文档的结构类型和各个标签的作用
2.了解了html元素的三大属性
3.搞清三大属性在js和css中的获取及其他们的在选择器中的优先级