(17.03.22)编码格式、实体字符、注释、选择器、伪类、标签
<!doctype html>---告诉这是一个页面
<html>
<head>---头部信息
<meta charset="utf-8">---
</head>
<body>----网页身体（专门放页面代码）
</body>
</html>
编码格式：
"utf-8"---国际通用
"gb2312"---中文
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
----html4.01-Transitional
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
----html4.01strict
<!doctype html>
---html5文档类型
实体字符：
空格：
大于号：>
小于号：<
学过的所有标签有哪些？
p h1--h6 a div span b i strong em img br
属性：属性名="属性值" 多个用空格隔开
私有
img
src
alt
a
href
公有
title
style
字体样式：
color：red；
font-size：12px；
font-weight：bold/normal;
font-style:italic/normal;
font-family:""
文本样式：
text-indent:2em;
text-decoration:none/line-through/underline/overline;
text-align:left/center/right；
line-height：200px；
其他的样式：
width：100px；
height：100px；
border：1px solid/dotted/dashed red；
background-image：url(图片路径)；
background-repeat：no-repeat；
background-position：10px 10px；
background-color：red；
background：url(图片路径) no-repeat 10px 10px red;
继承：
1. 只和文字相关
2. 子级继承父级的字体样式
注意：
有默认样式的标签不继承父级的该默认样式
有color默认样式的a不继承父级的color样式
----如果非要修改a的默认样式，就在a本身上添加修改！
html注释：
<!-- 被注释的内容 -->
css注释：
/* 样式内容 */
提取行间样式：
就是把行间样式写成内联样式
行间：在标签里面写属性style
内联：在head标签里面写一个标签<style>
选择器：
标签选择器 p
类选择器 class=“p1” .p1
注意：
1. 一个标签可以有多个class
2. 所有的标签的class名可以重复
id选择器 id=“pp1” #pp1
---独一无二！
注意：
1.一个标签只能有一个id名
2.所有的标签的id名不能重复
3.最好不要用id选择器来书写样式
4.id是留给js来获取写特效的
选择器优先级：
id > class > 标签
这些选择器可以混合使用！
嵌套选择器:
.p1 span{}
<人></人>
<人 class="张三"></人>
<人></人>
<人 class="张三"></人>
<人></人>
<人 class="张三" id="142034503243409"></人>
群组选择器：
.p1 div,p{ color:red;}
前提是div和p的样式是一样的！！！
伪类选择器：
写法：
div：XXX
.p1:hover{}
#p1:hover{}
a 全部兼容
a:link{ color:yellow;}--未访问之前
a:hover{ color:red;}----鼠标移入时
a:active{ color:green;}---点击时
a:visited{ color:#000;}---访问之后
注意：
页面上面可以点击的文字变色用的就是a：hover
W3C规范：lv ha
a:link{ color:yellow;}--未访问之前
a:visited{ color:#000;}---访问之后
a:hover{ color:red;}----鼠标移入时
a:active{ color:green;}---点击时
样式的优先级：
行间样式 id class 标签 默认样式 *（通配符-指代所有标签）
行间样式 > id > class > 标签 > * > 默认样式
认知一下所学过的标签：
标签类型
-
块标签（元素）：
div p h
特性：
1.独占一行
2.支持设置宽高
3.不受空格影响 -
行内标签（元素）：
span b i em strong a
特性:
1.共处一行
2.不支持设置宽高
3.受空格影响
包含关系：
- 块标签可以包所有标签！
注意：
1.div可以包含自己
2.p不能包含块标签 - 行内标签只能包行内元素！
注意：
a标签可以包含所有标签！
**行内和块可以互换！
display:block; --可以把行内变成块！
display:inline;---可以把块变成行内！
注意：
通过转换以后的标签不会改变：包含关系！
第三种类型：
行内块！
display:inline-block;
（包含行内特性还有块特性）
1. 可以设置宽高
2. 可以共处一行
3. 受空格影响
img与身巨来就是这样的类型
在页面中只要有块元素排在一行，我不建议你用行内快！
（浮动！）
cursor:pointer;---可以把鼠标模拟手型
新标签：
组合使用！
无序列表：
<ul>
<li></li>
</ul>
注意：
1.ul和li都是块标签
2.ul里面只可以放li
3.li的最近父级只可以是ul
4.li可以放任何标签
5.默认每一个li前面有个小圆点（默认样式）
---取消默认：list-style:none;
有序列表：
<ol>
<li></li>
</ol>
