CSS 总结

1,建立xhtml的目的就是实现html向xml的过渡。
2,真正符合标准的网页设计是指能够灵活使用web标准对web内容进行结构、表现、与行为的分离。
3,xhtml是一门面向结构的语言。表格的职能不在于进行网页布局,而是用来显示数据。
4,CSS代码一般放置位于head标签之中。
5,Transitional类型是xhtml文档类型的过渡类型,strct类型是严格类型,不允许使用任何表现样式的标识和属性。
6,对于每一个页面上,同样的id名称只能使用一次。
7,xhtml规范提出,使用id作为统一的名称标记,不推荐使用html中的name属性。
8,类型选择符例如:body{};包含选择符例如:h1 span{};id选择符例如:#content{};class选择符例如:.p1{};
9,组合使用,i:id与class与标签选择符例如:h1#content{};h1.p1{};组合选择符例如:h1 .p1,#content h1{} h1#content h2{};伪类伪对象例如a:hover{};通配符例如:*{};指所有标签下的样式。
10,单位:px(像素),pt(点、磅),em(相对与当前对象内文本的字体尺寸:可以用于设置当前对象的文字尺寸为同一行其他文字的尺寸的倍数)
11,样式应用:内部样式表不能垮页执行,取消使用。
12,优先权问题:id优先于class,相同属性,下优先于上,引用!important的作用是最先执行important.
13,xhtml默认两种对象类型:block块状对象,in-line行间对象(内联对象),div默认是block对象,span是in-line对象。
14,在适当情况下,应当尽可能少的使用嵌套,以保证浏览器不用过分消耗资源来对嵌套关系进行解析,
15,新型居中对齐中旧式:align="center",是一种样式代码,有违于分离原则,应采用margin:0px auto,来进行。
16,float用于控制对象的浮动布局。
17,一个对象的宽度不仅仅由width来决定,对象的真实宽度由对象本身的宽、对象的外边距、边框、内边距属性相加而成。
18,CSS的定位方式中除了float的浮动定位外,还包括position绝对定位。当使用position:absolute;时,可是设定top,right,bottom,left等四个方向的距离值,它从本质上从其他对象中分离出来,像图层一样漂浮与网页之上。
当使用position:relative时,代表该对象虽然进行了相对定位,但是其原始定位信息还存在与文档流及浮动对象之中。可以通过一组定位组合实现完全独立于其他对象,自身又可以相对定位。div嵌套中,外层用relative设定宽高值,不设定距离值脱离其他对象,内层用 absolute相对于外层定位。
19,一个对象的高度是否可以使用百分比显示,取决于对象的父级对象。
20,盒模型差异问题:
IE6/IE7/Firefox的最终宽度=margin-left+border-left+panding-left+width+padding-right+border-right+margin-right
IE5的最终宽度=margin-left+width+margin-right
21,上下margin叠加问题,i:空白边叠加时,以较大的margin值为准,ii:一旦把某个元素设定了float属性,那么它们不再进行空白边叠加。左右margin加倍问题用:display:inline来解决。
22,关于浮动的清理,用例如:clear:left,来拒绝左侧的浮动对象,或者另起空白div,设定clear:both;来拒绝左右浮动。
23,z-index:2;类似属性表示将以数值大小,大值对象的层级位于小值对象之上。
24,dispaly:block,可以使得一段文本改成一个块状对象,并设定宽高值。
25,设计中对于h1,h2对象需要添加属性:margin:0px,这是为了消除h1,h2元素在不加任何属性情况下,拥有自己默认样式下的大字体,大边距样式。
26,对于<ul>标签可以添加:list-style:none能够去除圆点标识。
27,关于背景的两个属性的缩写参数:
background-position:左对齐方式 上对齐方式
background:背景色 背景图片 背景平铺方式 背景滚动模式 背景定位
28,float:left更适合对象的布局模式,而不是信息的组织,如果希望信息显示为段落,用display:inline.
29,<table>是表单布局的重要帮手。th和td的作用基本相同,但是th还表示表头元素。
30,实际应用中,绝大部分计算机没有装除了宋体,黑体之外的其他字体,所以不建议在font-family中设置超过宋体,黑体之外的字体。 font-weight一般只有两种用法nomal和hold,对于其提供的200~900加粗号来说,IE并不完整支持,对于bold用来加粗,而 nomal用来去掉h1,strong中的默认加粗属性。font-varitant能使全部英文字母大写,并在大小上保持和小写一样。
31,在li元素中text-overflow使用clip值可以使超过对象宽度的内容不显示,设为ellipsis,则使末尾处变成省略号。使用word-break:keep-all,强制元素不能换行。
32,overflow使用hidden保持自身宽度大小,超过的被切断,用visible ,将随内容而改变。
33,关于强制换行,常用属性:
word-break:break-all;
word-warp:warp;
对于段落缩进对齐2个汉字常用:P{text-indent:2em},首字下沉用float:left最易设定。
34,对于图片的显示,如果需要剪切:clip:rect(number1 number2 number3 number4);分别表示上右下左4个边相对于左上角坐标(0,0)的便宜值。也可以用div结合overflow:hidden来实行强制剪切
<div>
<ima >
</div>
35,class使用技巧,可以让同一个元素使用多个class样式,方式如下,用空格隔开
<div class="c1 c2 c3"></div>这样的优先权是 c3>c2>c1,会覆盖相同的属性。
36,导入命令:@import url("XXX.css") print;导入文件xxx.css中的属性print.
37,垂直居中的在div+css解决方法:position:statci,取消掉相对定位,采用display:table及dispaly:table-cell将对象转化为表格显示方式,,再用vertical-align:middle,发挥作用。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值