css与html文档
0405作业实例网址：http://php.wangsoo.com/css/0405/
1. 非置换元素:双标签
<p style="background-color: lightgreen;">Hello World</p>2. 置换元素: 单标签 , 双标签
<img src="1.jpg" alt="" width="100" height="80" /><input type="text" style="width: 50px;" /><a href="" style="width: 50px;">php.cn</a><strong style="width: 100px;">PHP中文网</strong><!-- 行内元素,如果是非置换元素的话, 不能设置大小,如果是置换元素,可以设置宽高, 对于这类元素,称之为行内块元素 -->3.内部样式与外部文件
3.1：在html文档中如果添加其它内容,必须通过标签的方式加入
3.2：内部样式表, 写在当前的html文档中, 仅在当前文档有效
4.媒体选择器media
常用 “媒体描述符”(显示区域相关)
| 序号 | 媒体描述符 | 描述 |
|---|---|---|
| 1 | width |
显示区域宽度 |
| 2 | min-width |
显示区域最小宽度 |
| 3 | max-width |
显示区域最大宽度 |
| 4 | device-width |
设备显示区域宽度 |
| 5 | min-device-width |
设备显示区域最小宽度 |
| 6 | max-device-width |
设备显示区域最大宽度 |
| 7 | height |
显示区域高度 |
| 8 | min-height |
显示区域最小高度 |
| 9 | max-height |
显示区域最大高度 |
| 10 | device-height |
设备显示区域高度 |
| 11 | min-device-height |
设备显示区域最小高度 |
| 12 | max-device-height |
设备显示区域最大高度 |
max-width与max-device-width区别:
max-width: 浏览器显示区域宽度,与设备无关,通常用于 PC 端max-device-width: 设备分辨率的最大宽度,通常用于移动端
作业总结：
1.媒体选择器media是今后做html5页面的最常用的方法之一，能使开发的网站适应不同分辨率设备的浏览，应注意媒体查询器的使用方式，一般是从大到小的写法；
2.注意内部样式和引用外部样式的文件的使用，只在本页使用的的可以使用内部样式，通用性样式的一般写在外部文件引用；