注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

Jon的毛线球

叩首问路,码梦维生。

 
 
 

日志

 
 

CSS常用属性 和选择器优先级  

2014-05-14 10:11:48|  分类: HTML+CSS |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
引入方式的优先级:

标签内联>页面内嵌>外部文件样式>浏览器默认样式。

CSS选择器的优先级:css选择器优劣

id>class>tagName(标签名)

在CSS属性后声明 !important 优先级变为最高。在IE6中有bug。

各个优先级的特殊性:(用于判断选择器混用)

例:

div{color:red}   1

div span{color:red}  1+1

.bokan{color:red}  10

div .bokan{color:red}  1+10

#bokan{color:red}  100

style="color:red"  1000

.bokan .test{color} 10+10


ps:优先级高的选择器,即使其他选择器的特殊值相加更大,他们的优先级也不会大于优先级高的选择器



基本的CSS属性:

字体 font-family

font-family:宋体,Arail,Tabhoma,sans-serif

在CSS样式中我们可以定义多种字体,当浏览器打开页面时,会在系统中找寻设置的第一个字体,如果找不到,则寻找第二个
依次进行,如果找寻到第一种字体,就不在执行后面的字体。 如果都没有找到 将会使用 font-family的默认值“Times New Roman”来渲染
字体。

PS:1 中文页面宋体首选。2 英文页面 Arail Tahoma 3.中英结合最好用英文字体 。4 特殊字体一律用图片。

font-size字号:

font-size:px|百分比|em

网页中默认的字号16px 百分比就是 16px的包分之多少 1em的默认大小为16px。如果 父元素的默认大小为20px 那么 1em的默认大小为 20px。

font-style字体风格

font-style:normal(正常)|italic(斜体)|oblique(倾斜)

italic是对字的改动,oblique 对整个文本的倾斜。

font-weight字体的粗细

font-weight:normal(正常)|bold(加粗)|bolder(更粗的字符)|lighter(更细的字符)|number100-900 定义由粗到细的字符 400为正常 700为 加粗(bold);

font 复合属性:

font:font-style|font-variant|font-weigh|font-size|font-family;

文本颜色color

color:red|#ffffff;

属性可以是 颜色的英文,也可以是 RGB的数字。
0-255
红绿蓝
0-255 浅到深
都0 黑 都255白 等量 灰 

红 黄 绿 青 蓝 紫(颜色的判定)


文本修饰 text-decoration

text-decoration:none|underline(下划线)|overline(上划线)|line_though(删除)|blink(闪烁)

行高line-height:normal|length;

文本缩进text-indent:lenght;

段落开始的字符缩进,使用em更为便捷。

水平对齐text-align:left(左对齐)|right|center(居中)|justify(两端对齐)

垂直对齐vertical-align:top(顶)|bottom(底)|middle(上下居中)

字词间距word-spacing:normal|length(可为负值)

字符间距letter-spacing:normal|length(可为负值)

背景颜色 background-color:red|#ffffff

背景图片background-image:none|url(路径)

背景图默认是平铺的,若不想平铺 可设置background-repeat:repeat|no-repeat|repeat-x|repeat-y

repeat:平铺
no-repeat:不平铺
repeat-x:横向重复
repeat-y:纵向重复

背景位置background-position:x y|方位 left,right,center,top,bottom。

背景滚动background-attachment:scroll(随着滚动移动,默认)|fixed(不移动)

  评论这张
 
阅读(14)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017