CSS学习

属性（property）是您希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开。
selector {property: value}
例子：
在这个例子中，h1 是选择器，color 和 font-size 是属性，red 和 14px 是值。
h1 {color:red; font-size:14px;}


继承关系
body所拥有的属性（这些子元素诸如 p, td, ul, ol, ul, li, dl, dt,和 dd）。
body  {
     font-family: Verdana, sans-serif;
     }

派生选择器
li strong {
    font-style: italic;
    font-weight: normal;
  }
<li><strong>我是斜体字。这是因为 strong 元素位于 li 元素内。</strong></li>

h2 strong {
     color: blue;
}

-------------------------------------------------
id 选择器
id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。
id 选择器以 "#" 来定义。

例子
#red {color:red;}
#green {color:green;}
<p id="red">这个段落是红色。</p>
<p id="green">这个段落是绿色。</p>

在 CSS 中，类选择器以一个点号显示：
.center {text-align: center}
<h1 class="center">

点获取属性class的元素
和 id 一样，class 也可被用作派生选择器：
.fancy td {
color: #f60;
background: #666;
}

属性选择器
[title]
{
color:red;
}
<h2 title="Hello world">Hello world</h2>
获取元素属性类型

[title=W3School]
{
border:5px solid blue;
}

将为 title="W3School" 的所有元素设置样式：
input[type="button"]
{
  width:120px;
  margin-left:35px;
  display:block;
  font-family: Verdana, Arial;
}
<input type="button" value="Example Button">
获取input 类型为button的控件


插入样式表
<link rel="stylesheet" type="text/css" href="mystyle.css" />
引用外部css文件

CSS 背景
background-color

例
p {background-color: gray;}
<p> css的背景颜色</p>

设置背景图片
body {background-image:url(D:/3.jpg);}

派生背景图片 class
p.flower {background-image: url(D:/3.jpg); padding: 20px;}
a.radio {background-image: url(D:/3.jpg);  padding: 20px;}

<p class="flower">我是一个有花纹背景的段落。


如果需要在页面上对背景图像进行平铺，可以使用 background-repeat 属性。

body {background-image:url(D:/3.jpg);
background-repeat:no-repeat;
background-position:center;
}