欢迎来到天天文库
浏览记录
ID:37917701
大小:82.50 KB
页数:7页
时间:2019-06-02
《CSS 指层叠样式表学习手册》由会员上传分享,免费在线阅读,更多相关内容在教育资源-天天文库。
1、CSS指层叠样式表(CascadingStyleSheets)HTML标签原本被设计为用于定义文档内容。通过使用
、
2、="stylesheet"type="text/css"href="mystyle.css"/>内部样式表你可以使用内联样式Thisisa
3、为斜体字,而不是通常的粗体字,可以这样定义一个派生选择器listrong{font-style:italic;font-weight:normal;}class也可被用作派生选择器.fancytd{color:#f60;background:#666;}td.fancy{color:#f60;background:#666;}选择器的分组你可以对选择器进行分组,这样,被分组的选择器就可以分享相同的声明。用逗号将需要分组的选择器分开。在下面的例子中,我们对所有的标题元素进行了分组。所有的标题元素都是绿色的。h1,h2,h3,h
4、4,h5,h6{color:green;}继承及其问题根据CSS,子元素从父元素继承属性。body{font-family:Verdana,“宋体”;}CSS框模型(BoxModel)规定了元素框处理元素内容、内边距、边框和外边距的方式。大多数浏览器都会按照上面的图示来呈现内容根据W3C的规范,元素内容占据的空间是由width属性设置的,而内容周围的padding和border值是另外计算的。不幸的是,IE5.X和6在怪异模式中使用自己的非标准模型。这些浏览器的width属性不是内容的宽度,而是内容、内边距和边框的宽度的总和。*{margin:0;paddi
5、ng:0;}CSS伪类a:link{color:#FF0000}/*未访问的链接*/a:visited{color:#00FF00}/*已访问的链接*/a:hover{color:#FF00FF}/*鼠标移动到链接上*/a:active{color:#0000FF}/*选定的链接*/提示:在CSS定义中,a:hover必须被置于a:link和a:visited之后,才是有效的。提示:在CSS定义中,a:active必须被置于a:hover之后,才是有效的。提示:伪类名称对大小写不敏感。伪类可以与CSS类配合使用a.red:visited{color:#FF0
6、000}CSSSyntaxCSS尺寸height设置元素的高度。line-height设置行高。max-height设置元素的最大高度。max-width设置元素的最大宽度。min-height设置元素的最小高度。min-width设置元素的最小宽度。width设置元素的宽度。CSS相对定位相对定位是一个非常容易掌握的概念。如果对一个元素进行相对定位,它将出现在它所在的位置上。然后,可以通过设置垂直或水平位置,让这个元素“相对于”它的起点进行移动。如果将top设置为20px,那么框
7、将在原位置顶部下面20像素的地方。如果left设置为30像素,那么会在元素左边创建30像素的空间,也就是将元素向右移动。#box_relative{position:relative;left:30px;top:20px;}如下图所示:CSS绝对定位绝对定位使元素的位置与文档流无关,因此不占据空间。这一点与相对定位不同,相对定位实际上被看作普通流定位模型的一部分,因为元素的位置相对于它在普通流中的位置。普通流中其它元素的布局就像绝对定位的元素不存在一样:#box_relative{position:absolute;left:30px;top:20px;}d
8、iv、h1或p元素常常被称为块级元素。这意味着这些元
此文档下载收益归作者所有