首页 > Web开发 > 详细

CSS基础知识笔记(三)

时间:2015-11-25 19:11:23      阅读:285      评论:0      收藏:0      [点我收藏+]
继承
继承是一种规则,它允许样式不仅应用于某个特定html标签元素,而且应用于其后代。比如下面代码:如某种颜色应用于p标签,这个颜色设置不仅应用p标签,还应用于p标签中的所有子元素文本,这里子元素为span标签。
CSS中存在一些不能继承的样式,如:
border:1px solid red;
特殊性
同一标签设置不同的css样式,游览器根据标签权值来判断使用哪个CSS样式。
标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100。
继承也有权值且为最低。
p{color:red;} /*权值为1*/
p span{color:green;} /*权值为1+1=2*/
.warning{color:white;} /*权值为10*/
p span.warning{color:purple;} /*权值为1+1+10=12*/
#footer .note p{color:yellow;} /*权值为100+10+1=111*/
 
层叠
含义:在HTML文件中对于同一个元素可以有多个CSS样式存在,当有相同权重的样式存在时,会根据这些css样式的前后顺序来决定处在最后面的样式会被应用。
样式优先级:内联样式表(标签内部)> 嵌入样式表(当前文件中)> 外部样式表(外部文件中)。
重要性
特殊情况下将某些样式提升到最高权值,需要用如下代码来解决:
p{color:red!important;}
!important必须写在分号的前面
样式优先级:
游览器默认样式<网页制作者样式<用户设置样式
 
文字排版-字体、字号、颜色
通用字体:微软雅黑
body{font-family:"Microsoft Yahei";} /*兼容性更好*/
body{font-family:"微软雅黑";}
字号颜色:
body{font-size:12px;color:#666}

文字排版-粗体、斜体、下划线
粗体:span{font-weight:bold;}
斜体:a{font-style:italic;}
下划线:span{text-decoration:underline;}
text-decoration指的是:文本的装饰,属性值有none默认不显示下划线.
none: 指定文字无装饰
underline: 指定文字的装饰是下划线
overline: 指定文字的装饰是上划线
line-through: 指定文字的装饰是贯穿线
blink: 指定文字的装饰是闪烁。

文字排版-删除线、缩进、行间距(行高)
删除线:.oldPrice{text-decoration:line-through;}为文字加删除线
缩进:p{text-indent:2em;} 2em的意思就是文字的2倍大小。
行间距:p{line-height:1.5em;} 设置段落行间距1.5倍
 
段落排版-中文字间距、字母间距、对齐
中文字、字母间距:
p{letter-spacing:50px;}(中文字和字母间距)
p{word-spacing:50px;}(字母和字母间距)
对齐:
p{text-align:center;} 居中
p{text-align:left;} 居左
p{text-align:right;} 居右

 

CSS基础知识笔记(三)

原文:http://www.cnblogs.com/frankonhisway/p/4995366.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!