css的简单学习

css样式若是比较大的话，就写入到一个文件中，而后连接引用过来

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

还有一种导入样式

<style type="text/css">

<!--

@import url(1.css);

-->

</style>

这个和链接式原理相似。

css的选择器

一、标记选择器

h2 {

color:#FF33CC;

text-dexoration:underline;

font-family:黑体;

font-size:28px;

}

直接对html的内置标记生效

二、类别选择器

.classname1 {

color:green;

font-size:20px;

}

使用例子<p class="classname1">类别选择器</p>

三、

id选择器

#id1 {

color:green;

font-size:20px;

}

使用的时候

<p id="id1">Id1选择器使用</p>

选择器能够设置一个集体声明

h1,h2,h3 {

color:purple;

font-size:14px;

}

h2.special, .special, #one {

text-decoration:underline;

}

h2.special用于

<h2 class="special">用于</h2>

.special用于

<p class="special">选择器集体声明</p>

#one

<p id="one">选择器集体声明</p>

选择器的嵌套

p b {

  color: green;

  text-decoration: underline;

  font-size:12px;

}

适用于

<p>选择器嵌套<b>使用css标记</b>的方法</p>

对于<b>xxx</b>无效

子选择器

ul.myList > li > a {

color:blue;

}

适用于

<ul class="myList">

  <li><a href="http://picasa.google.com">issac's Pi</a></li><!--css只适用这一行-->

     <ul>

        <li><a href="#">CSS1</a></li><!--孙样式，不适合-->

        <li><a href="#">CSS2</a></li>

     </ul>

  </li>

</ul>