2017-12-11

猎数博客

数据挖掘,机器学习

CSS 参考

作者:江航 / 2012-06-17 / (阅读 1,440 次) /



CSS 语法参考

  1. CSS基本语法
  2. CSS选择器
  3. CSS继承
  4. CSS优先级
  5. CSS文件引用

CSS基本语法:

CSS语法由三个部分构成,选择符,属性和值:
格式: selector{property:value}
选择符可以是多种形式,一般是需要定义样式的HTML标记,如body,P等等。多个属性之间要用分号分开。例如:


p{

font-family:”宋体”;

text-align:center;

}


CSS选择器

  1. 标签选择器

标签选择器就是直接将HTML的标签作为选择器,决定标签采用的样式,如上面的例子,所有的P标签都用同样的样式

  1. 选择器组

将相同属性的选择器组组合起来书写,用逗号将他们分开。例如:


h1,h2,h3,h4,h5,h6 {

color:#000000;

} /*所有的标题头文字颜色都为黑色*/
  1. 类选择器

.black {
color:#000000;
} /*设置字体的颜色为黑色*/
.green {
color:green;
} /*设置字体颜色为绿色*/


 hello world
 hello world
 hello world
  1. ID选择器

只需要将.换成#即可,引用的时候用id=””


#size {
font-size:22px;
} /*设置字体的大小为22px*/
#size1 {
font-size:16px;
}


 hello world
 hello world
  1. 相邻选择器

如果一个标题元素后紧跟了2个P元素,可以定位其中的一个P来指定样式


h1 + p {
font-size:22px;
} /*设置字体的大小为22px*/
.p {
font-size:16px;
}


 hello world
hello , 22px 
hello , this is 16px 
  1. 后代选择器

后代选择器用于所有的子后代元素,通过空格来选择,外层标记写在前面,内层标记写在后面,当标记嵌套时,内层标记就是外层标记的后代。


#links a {
font-size:20px;
color:#000000;
} /*设置字体的大小为22px*/
a span{
font-weight: 700 ; /*加粗a的span标签*/
}


 hello world
 hello world weight 700

CSS继承:
CSS继承是指包在内部的标签自动具有外部标签的样式。如此可以首先预设整个网页的样式,然后对局部样式进行修改。例如


body {
font-size:20px;
color:#000000;
} /*设置字体的大小为22px*/


 HELLO  WORLD  


上面的例子中,P标签自动具有body的样式,然后在P中再添加其他的样式。通常,在CSS最前面定义通篇文档的所有元素:


* {

margin:0;

padding:0

border:0

}


但是有些属性是不能继承的,多数边框类的属性不能继承。如border,padding(内边框),margin(外边框),background

CSS优先级
1. 继承不如指定
2. ID > 类 > 标签选择器
3. 越具体级别越高
4. 标签#id > #id , 标签.class > .class
CSS文件引用





本文地址: http://www.bagualu.net/wordpress/archives/1439 转载请注明






相关文章

  • twentyfourteen 页面结构( 1,850 )
  • bash快速参考( 1,708 )
  • firefox 开发者工具( 1,659 )
  • css background-position( 1,652 )
  • 打算学习一下这个主题的CSS( 1,609 )
  • CSS block和inline( 1,577 )
  • 设计一个主题( 1,524 )
  • CSS3的font-face( 1,481 )
  • CSS 参考( 1,440 )
  • 语言快速参考( 1,411 )
  • Leave a Reply

    您必须登录以发表评论,

    沪ICP备11036560号
    联系我: jianghang at bagualu.net