<table><tr><td bgcolor=skyblue> 屏幕分辨率的像素 设计师给1920，开发人员要知道兼容所有设备。1366，1440，1920，2k</td></tr></table>

CSS基础

链接CSS的三种方式

1. 外部样式 link / @import
   <link rel= "stylesheet", href="index.css">层叠样式表
2. 行内样式
   <h2 style = "color: red;">行内样式</h2>多用于js
3. 内部CSS //页面头部样式表 style放头部

HTML加载顺序

1. 加载HTML-DOM结构
2. CSS和JS
3. 图片和多媒体
4. 加载事件触发

CSS规则

<font color=green size=4>选择器{声明块}</font>

h1{color: red; text align: center;}

1. <font size=3> h1:选择器;选中页面上的元素；
2. color: red; text-align: center;
   声明块，声明属性。对选中元素应用样式。</font>

100个元素，选择器选择范围（最大值，最小值）（0，99）
选择器{声明块； 声明1； 声明2； ...声明n； 属性名：属性值；}

<font color=green>
选择器：选中HTML页面上的元素

1. 元素选择器

   1. 格式：元素名（ 标签名、标记名）{声明块}
   2. h1{ color: deeppink; background-color:skyblue; }

2. 类选择器

   • 格式
     
     .类名{声明块}
     
     类名就是HTML中class属性的属性值

3. 子（代）元素选择器

   • 格式：父元素名称>子元素名称{ 声明块 }
   • 前提：嵌套。可以嵌套很多层但是只能一层一层选
   • header>div>div>section>div>a{ }
     </font>

<font color=deeppink>
代码报错：

1. 红色 一定出错一般是上一行
2. 黄色 可能出错
3. 绿色 正常运行

</font>

1. 元素对齐方式：
   text-align: center; //left;right;实现水平居中
2. 行高：
   line height:100px;可以实现垂直居中

元素的层次结构：

• 前提：嵌套
  • 父子关系
  • 兄弟关系
  • 祖先后代关系

这盒子还装不下你吗？

注释的写法：