x? 1 2 3 ? ? ? ? ? ? . ? ? ? ? ? ? ? ? ? ?
背景图:background-image;
边框的样式
批量创建：父元素>子元素 * #>属性 *#
span标签:在行内定义一个区域，也就是一行内可以被划分成好几个区域，从而实现某种特定效果。本身没有任何属性。例子logo标签
<html>
<head>
<meta charset="UTF-8">
<title>Google Logo</title>
<style type="text/css">
.G{color: blue;font-weight: bolder;font-size: 60px;}
.O1{color:brown;font-weight: bolder;font-size: 60px;}
.o2{color: yellow;font-weight: bolder;font-size: 60px;}
</style>
</head>
<body>
<span class="G">G
</span>
<span class="O1">o
</span>
<span class="o2">o
</span>
<span class="G">g
</span>
<span >le
</span>
</body>
</html>
（标题嵌套的过程中，必须先结束的靠近内容的标题，再按照由内及外的顺序依次关闭标题）
键对值：即为对“属性”设置“值” 如color=“red”
块元素:独占一行,宽与父元素同宽,高度取决于内容. 可以直接设置宽高
div\p?li \ul
行内元素:和其它元素共享一行,宽高都取决于内容.不可以设置宽高
span\a\em\strong
行内块元素:和其它元素共享一行,宽高都取决于内容,可以设置宽高
button\input\img
p：段落标记
：注释标记
hr ：插入横线
color ：颜色
align ：对齐方式
strong：加粗 em：倾斜标记
hspasce ：水平间距
br ：换行
&emsp ：空两格
a href :超链接
hr ：横线
style：内嵌样式
<!doctype html>
<html>
<htad>
<meta charset="utf-8">
<title>style标记的使用</title>
<style type="text/css">
h2{color:red}
p{color:blue}
</style>
</htad>
<body>
<h2>设置h2标题的颜色为红色</h2>
<p>设置p段落的颜色为红色</p>
</body>
</html>1.4.1 常用的图像格式
1.4.2 图像标记
src 图像的路径：
alt 图像不能显示时的替换文本
title 鼠标悬停时图片的提示文字
width 和 height宽高(通常指设置一个)
通常只设置一个，另一个自动按比例显示
border 边框属性
vspace(垂直) 和 hspace(水平) 边距
align 对齐属性
html5不赞成使用border vspace hspace align,通过CSS设置
页面内跳转的锚点设置,页面内的跳转需要两步：
方法一：
①：设置一个锚点链接去找喵星人；（注意：href属性的属性值最前面要加#）
②：在页面中需要的位置设置锚点；（注意：a标签中要写一个name属性，属性值要与①中的href的属性值一样，不加#）标签中按需填写必要的文字，一般不写内容
方法二：
①：同方法一的①
②：设置锚点的位置
方法二不用单独添加一个a标签来专门设置锚点 ，只在需要的位置的标签中添加一个id即可。
<header>
<h1>网页主题</h1>
</header>nav元素用于定义导航链接，是html5新增的元素。该元素可以将具有导航性质的链接归纳在一个区域中，使页面元素的语义更加明确。
nav元素通常可以用于以下场合中：
<article>
<header>
<h1>第一章</h1>
</header>
<section>
<header>
<h2>第1节</h2>
</header>
</section>
<section>
<header>
<h2>第2节</h2>
</header>
</section>
</article><article>
<header>
<h1>标题</h1>
</header>
<section>文章主要内容</section>
<aside>其他相关内容</aside>
</article>
<aside>右侧菜单</aside><article>
<header>
<h2>小张的个人介绍</h2>
</header>
<p>小张是一个好学生，是一个帅哥。。。</p>
<section>
<h2>评论</h2>
<article>
<h3>评论者：A</h3>
<p>小张真的很帅</p>
</article>
<article>
<h3>评论者：B</h3>
<p>小张是一个好学生</p>
</article>
</section>
</article><article>
文章内容
<footer>
文章分页列表
</footer>
</article>
<footer>
页面底部
</footer>被称作“第四代体育馆”
拍摄者：张三，拍摄时间：2019年9月15日 17:42:12
开心快乐每一天
datails元素用于描述文档或文档某个部分的细节。
summary元素经常与details元素配合使用，作为details元素的第一个子元素，用于为detalis定义标题。标题是可见的，当用户单击标题时，会显示或隐藏details中的其他内容。
标准通用标记语言下的一个应用HTML标准自1999年12月发布的HTML4.01后...
1
2
3
4
5
6
2detail元素没有
点击前：
标准通用标记语言下的一个应用HTML标准自1999年12月发布的HTML4.01后...
progress元素可用于表示一个任务的完成进度。这个进度可以是不确定的，只是表示进度正在进行，但是不清楚还有多少工作量没有完成。也可以用0到某个最大数值（如100）之间的数字来表示准确的进度完成情况（如进度百分比）。
progress元素的常用属性值有两个。
（1）value：已经完成的工作量。
（2）max：总共有多少工作量。
需要注意的是value和max属性的指必须大于0，且value的值要小于或者等于max属性的值。
meter元素用于表示指定范围内的数值。例如，显示硬盘容量或者某个后选者的投票人数占投票总人数的比例等，都可以使用meter元素。
optimum的值小于low值时显示绿色，大于high值时显示红色；low和high之间是黄色。
1
硬盘使用情况：
硬盘使用情况：
time元素用于定义时间或日期，可以代表24小时中的某个时间。
time元素不会在浏览器中呈现任何特殊效果，但是该元素能以机器可读方式对日期和时间进行编码，这样，用户能够将生日提醒或其他事件添加到日程表中，搜索引擎也能够生成更智能的搜索结果。
time元素有两个属性。
（1）datetime：用于定义相应的时间或日期。取值为具体时间（如14：00）或具体日期（如2015-09-01），不定义该属性时，由元素的内容给定日期/时间。
（2）pubdate：用于定义time元素中的日期/时间是文档（或article元素）的发布日期。取值一般为“pubdate”。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>time元素的使用</title>
</head>
<body>
<p>我们早上<time>9:00</time>开始上班</p>
<p>今年的<time datetime="2015-10-01">十一</time>我们准备去旅游</p>
<time datetime="2015-08-15" pubdate="pubdate">
本消息发布于2015年8月15号
</time>
</body>
</html>
为了某个使元素可编辑，你所要做的就是在html标签上设置"contenteditable"属性，它几乎支持所有的HTML元素。
contenteditable有以下几种属性：
"true" 表明该元素可编辑"false" 表明该元素不可编辑"inherit" （默认）表明该元素继承了其父元素的可编辑状态<div contenteditable="true">
This text can be edited by the user.
</div>
contenteditable属性，其默认值继承自父元素（既默认为"inherit"属性）<div contenteditable="true">
<p>Edit this content to add your own quote</p>
<p>Edit this content to add your own quote - 2</p>
</div>
可以使用css中caret-color属性设置文本插入光标的颜色。
1.div模拟textarea文本域轻松实现高度自适应
2.避免处理input、textarea的内含样式
将CSS 代码集中写在
头部标记中，并用