1、css,Cascading Style Sheets(层叠样式表单),参考网站:http:/ 先建立外部样式表文件(.css),然后使用HTML的link对象。示例如下:文档标题2. 内联样式(在 HTML 元素内部) 这一行被增加了左右的外补丁,3. 内部样式表(位于 标签内部)文档标题 。,在HTML中引入CSS的方式,:派生选择器,id选择器,class选择器,属性选择器,内容提要,选择器,选择器-派生选择器,派生选择器允许你根据文档的上下文关系来确定某个标签的样式。通过合理地使用派生选择器,我们可以使 HTML 代码变得更加整洁。,选择器-id选择器,id 选择器可以为标有特定 id
2、的 HTML 元素指定特定的样式。 每个id 属性只能在每个 HTML 文档中出现一次 id 选择器以 “#“ 来定义。,选择器-class选择器,在 CSS 中,类选择器以一个点号显示:,选择器-属性选择器,对带有指定属性的 HTML 元素设置样式。可以为拥有指定属性的 HTML 元素设置样式,而不仅限于 class 和 id 属性。 注释:Internet Explorer 7 (以及更高版本)在规定了 !DOCTYPE 的情况下支持属性选择器。IE6 及更低的版本不支持属性选择器。,:派生选择器,id选择器,class选择器,属性选择器,内容提要,样式,样式-背景background,举
3、例:,样式-文本text,举例:,样式-字体font,样式-列表list,样式-列表list,样式-表格table,样式-表格table,样式-轮廓outline,举例:,:派生选择器,id选择器,class选择器,属性选择器,内容提要,框模型,框模型,框模型-内边距padding,举例:,框模型-边框border,举例:,框模型-边框border,框模型-外边距margin,举例:,:派生选择器,id选择器,class选择器,属性选择器,内容提要,定位,基本思想:它允许你定义元素框相对于其正常位置应该出现的位置,或者相对于父元素、另一个元素甚至浏览器窗口本身的位置。,定位,定位-相对定位relative,举例(相对定位):,定位-绝对定位absolute,举例(绝对定位):,定位-固定定位absolute,举例(绝对定位):,THANK YOU,