XHTML CSS网页布局基础-CSS基础课件.ppt

档名称:PPT演示模板 Copyright(c)GillionPage1of5Author:HellenVersion::+CSS网页布局基础-CSSCSS·目录SS基础CSS定位和浮动CSS隐藏属性CSS基础CSS概述CSS指层叠样式表(CascadingStyleSheets)样式定义如何显示HTML元素样式通常存储在样式表中把样式添加到HTML中,是为了解决内容与表现分离的问题外部样式表可以极大提高工作效率外部样式表通常存储在CSS文件中多个样式定义可层叠为一SS基础CSS层叠次序内联样式: <pstyle=“font-size:15px;”>12345</p>内部样式表: <styletype="text/css"> <!-- body,td,th{font-size:12px;} --> </style>外部样式表: <linkhref=“…"rel="stylesheet"type="text/css"/>联样式内部样式表外部样式表浏览器缺省设置CSS基础CSS语法elector{property:value;} *{width:100;} td{……} div{……} a,p{……} #menu{……} .class{width:100;} .classtd{……} #menudiv{……} a:link{……} 未访问的连接(未点过) a:visited{……} 已访问的连接(已点过) a:hover{……} 鼠标移动到链接上 a:active{……} 获得焦点CSS基础CSS选择器优先级联样式ID选择器派生选择器类选择器元素选择器CSS定位和浮动与定位相关的几个CSS属性osition 把元素放置到一个静态的、相对的、绝对的、或固定的位置中。top 定义了一个定位元素的上外边距边界与其包含块上边界之间的偏移。left 定义了定位元素左外边距边界与其包含块左边界之间的偏移。bottom 定义了定位元素下外边距边界与其包含块下边界之间的偏移。right 定义了定位元素右外边距边界与其包含块右边界之间的偏移。z-index 设置元素的层叠顺序。CSS定位和浮动相对定位#box_relative{position:relative;left:30px;top:20px;}在使用相对定位时,无论是否进行移动,元素仍然占据原来的空间。