css 选择器

派生选择器： 只改变li 下的strong

li strong {
    font-style: italic;
    font-weight: normal;
  }

id选择器： id 可被用作派生选择器：

div#sidebar {
    border: 1px dotted #000;
    padding: 10px;
    }
#sidebar p {
    font-style: italic;
    text-align: right;
    margin-top: 0.5em;
    }

#sidebar h2 {
    font-size: 1em;
    font-weight: normal;
    font-style: italic;
    margin: 0;
    line-height: 1.5;
    text-align: right;
    }

类选择器：和 id 一样，class 也可被用作派生选择器：

.center {text-align: center}

.fancy td {
    color: #f60;
    background: #666;
    }
td.fancy {
    color: #f60;
    background: #666;
    }
<td class="fancy">

属性选择器：

[title]
{color:red }
适用于所有包含title的

[title="w3c"]
{color:red }
适用于title="w3c" 

[title~="w3c"]  {color:red}
适用于空格连接的值，如： title=“w3c hehe” tile="hh w3c"
 
[title |="w3c"] {color:red}
适用于以“-”连接的值，如：title="w3c-hhhh" title="w3c"

外部样式表

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>

内部样式表

<head>
<style type="text/css">
  hr {color: sienna;}
  p {margin-left: 20px;}
  body {background-image: url("images/back40.gif");}
</style>
</head>

内联样式

<p style="color: sienna; margin-left: 20px">
This is a paragraph
</p>

多重样式

http://www.w3school.com.cn/css/css_howto.asp

 

posted @ 2014-11-13 01:25  beyondbycyx  阅读(129)  评论(0)  编辑  收藏  举报