HTML <!DOCTYPE> html 基础知识和css 基础知识
常用的声明
HTML5
<!DOCTYPE html>
##sample 1
调试方法
style="border: 1px solid red; width: 30%; display: inline
##参考资料
https://www.runoob.com/html/html-css.html
https://baijiahao.baidu.com/s?id=1699636363193409611&wfr=spider&for=pc
1、CSS，即层叠样式表，用来规定网页显示效果的。
2、CSS的基本工作原理，选择器{ 样式声明; 样式声明; 样式声明; …… }
3、常见的选择器：标签选择器（所有的HTML标签都可以作为标签选择器，记住标签选择器前面没有任何符号）、类选择器（对应HTML的class属性，类选择器前面是英文小数点，例如.box{ width:200px;}）、ID选择器（对应HTML的id属性，ID选择器前面是#，例如#tips{ color:red;}）
4、常见的9个文本和字体属性如下：
1) color 定义字体颜色属性。例如color:red;
2) font-family 定义字体类型属性。例如font-family: "宋体";
3) font-size 定义字体大小属性。例如font-size: 16px;
4) font-weight 定义字体粗细属性。例如字体加粗定义为font-weight: bold;
5) font-style 定义字体风格属性。例如文字倾斜定义为font-style: oblique;
6) line-height 定义行间距属性，即行高。例如，line-height: 24px;单行文本垂直居中，将行高设置为方框盒子的高度值。
7) text-align 定义文本对齐属性。例如文本右对齐则定义为text-align:right;
8) text-indent 定义文本缩进属性（段首缩进）。例如文本首行缩进text-indent:32px;
9) text-decoration定义文本修饰属性。例如
上划线 text-decoration: overline;
下划线 text-decoration: underline;
删除线 text-decoration:line-through;
5、背景属性background，其子属性有：background-color（背景颜色）、background-image（背景图像）、background-repeat（背景重复属性）、background-position（背景定位属性）。
6、盒子模型相关属性：
1) 内边距：padding
2) 外边距：margin，margin:0 auto;该元素相对于其父类居中显示。
3) 边框：border（子属性有：border-color边框颜色、border-width边框宽度、border-style边框样式）
4) 元素内容尺寸：width元素内容宽度属性、height元素内容高度属性。
注意：padding、margin和border属性有方向。
7、盒子的浮动相关属性：
1) float属性：定义盒子向左或右浮动。
2) overflow属性：定义盒子溢出时的显示效果。当一个方框盒子没有定义高度时，需要使用overflow:hidden;
3) display属性：规定HTML元素是显示为块级元素还是行内元素。块级元素默认的显示为block，行内元素默认显示为inline。将行内元素转化为块级元素可以使用“display:block;”，将块级元素转化为行内元素可以使用“display:inline;”。
8、常见的块级元素：body、<h#>、<p、<ul>/<li>，<ol>/<li>，<dl>/<dt>/<dd>，<hr>等；
常见的行内元素：<img>、<a>、<span>、<em>、<strong>
9、可用于网页排版的CSS属性：float、position（相对定位于绝对定位数学），margin:0 auto;其中float与position属性会改变HTML文档的文档流属性，而margin:0 auto；不会改变HTML文档的文档流属性。
10、文档流：标准文档流与非标准文档流，标准文档流是指HTML元素自然排列（即没有使用float与position属性。）
11、绝对多数的块级元素都有默认的内外边距（padding，margin）。div标签没有默认的内外边距。
12、CSS样式表的优先级：行内式>内嵌式>外部式样式表。
13、CSS选择器的优先级：
以下是一个按特性分类的选择符的列表：
h2{color:blue;} 特性值为：1
p em {color:purple;} 特性值为：2
.apple {color:red;} 特性值为：10
p.bright {color:yellow;} 特性值为：11
p.bright em.dark {color:brown;} 特性值为：22
#id316 {color:yellow} 特性值为：100
从上表我们可以看出#id316具有更高的特殊性，因而它有更高的权重。当有多个规则都能应用于同一个元素时，权重越高的样式将被优先采用。
14、padding（内边距），margin（外边距），height（高度），background（背景）、display属性、overflow属性等都是不继承的。
15、*{padding:0; margin:0; list-style-type:none; }其中“*”代表通配符，这种全局声明，也叫做通用选择器。
16、CSS锚伪类：
a:link{ color:red;}
a:visited{ color:blue;}
a:hover{color:yellow;}
a:active{ color:purple;}
a:hover必须放在a:link{}和a:visited{}之后，
a:active必须放在a:hover的后面。
17、合理的设置TDK标签（网页三标签）有助于SEO，TDK指的是网页标题标签<title>、网页描述标签description以及网页关键词标签keywords。
18、有助于网站优化的HTML文档结构必须要有meta标签定义的description与keywords：
<html>
<head>
<meta charset="utf-8">
<title>HTML基础</title>
<meta name="description" content="网页正文摘要">（说明）
<meta name="keywords" content="网页关键词">（关键字）
<link href="yangshi.css" rel="stylesheet" type="text/css">
</head>
<body>
网页内容
</body>
</html>
19、网页的字符集charset包括：utf-8(国际通用字符集)、gbk（gb2312、gb18030等简体中文字符集）、big5（繁体中文字符集）。
20、图片<img />标签必须要书写alt属性，以便于搜索引擎更好的识别图片内容。
21、<h#>标签默认效果为强调：加粗、默认字号、换行效果，合理的使用H标签（特别是H1、H2和H3），有利于搜索引擎快速的了解网页的主题内容。其中H1标签在一个网页只能够使用1次，一般在文章标题处使用。
22、选择图片素材的时候，在不影响图片清晰度前提下，图片所占用的空间要最小。
23、所谓的超链接是指从一个网页指向一个目标的连接关系，这个目标可以是另一个网页，也可以是相同网页上的不同位置，还可以是一个图片，一个电子邮件地址，一个文件，甚至是一个应用程序。
24、超链接是搜索引擎蜘蛛不断地抓取网页的桥梁。
25、URL：统一资源定位符，是Uniform Resource Locator的缩写，也被称为网页地址，是Internet上标准的资源地址。Internet上的每一个网页对应一个唯一的URL地址。
任何一个URL，它只会指向一个网页。
以新浪体育网和腾讯体育网的NBA频道为例：
/nba/：相对地址
http://sports.sina.com.cn/nba/绝对地址
https://sports.qq.com/nba/绝对地址
