7.13 CSS
一.字體設(shè)置樣式
1.字體系列：p 標(biāo)簽{? font-family:"宋體";}一般都是微軟雅黑，寫(xiě)英文比較好：microsoft? Yahei
2.字體大惺读：font-size 20px;
3.字體粗細(xì)： font-weight bold(粗體)
4.字體樣式：font-style 正常：normal 斜體：italic? 強(qiáng)制傾斜：oblique
5.color：三種設(shè)置顏色方式（1）英文單詞 （2）rgb：133，45偏窝，200 rgb：20%钢坦，35%兔港，50%
（3）十六進(jìn)制：00-ff color:#00ffcc
body {
? ? ? ? font-style: italic;
? ? ? ? font-weight: bold;
? ? ? ? font-size: 20px;
? ? ? ? line-height: 1.6em;
? ? ? ? font-family: "宋體", sans-serif;
? ? }
上面樣式簡(jiǎn)寫(xiě)：
body{
font:italic bold 20px/1.6em "宋體",sans-serif;
}
二.文本樣式
1.text-decoration ：三種方式：overline:線在頭上? underline：線在下? line-through：線從中間過(guò)雹嗦，一般用于打折范舀。
2.開(kāi)頭空兩格首行縮進(jìn)：p{text-indent:2em;}
3.文字設(shè)置行間距：p{line-height:1.5em;}
4.文字間隔設(shè)置：（1）字母間隔：letter-spacing：20px? （2）文字間隔：word-spacing：30px
5.排列方式：文本對(duì)齊方式：text-align：center，left,right
6.長(zhǎng)度值：px（像素） em 百分比相對(duì)單位??
?px：90px=1英寸??
em：font-size=14px ;text-indent:2em; 2em=2*14=28px;首行縮進(jìn)28px了罪，兩個(gè)字體大小
特殊情況：但當(dāng)給 font-size 設(shè)置單位為em時(shí)尿背，此時(shí)計(jì)算的標(biāo)準(zhǔn)以 p 的父元素的 font-size 為基礎(chǔ)。如下代碼：
html:
<p>以這個(gè)<span>例子</span>為例捶惜。</p>
css:
p{font-size:14px}
span{font-size:0.8em;}
結(jié)果 span 中的字體“例子”字體大小就為 11.2px（14 * 0.8 = 11.2px）。
%百分比：p{font-size:12px;line-height:130%}
設(shè)置行高（行間距）為字體的130%（12 * 1.3 = 15.6px）荔烧。
三.元素分
1.塊狀元素吱七，內(nèi)聯(lián)元素，內(nèi)聯(lián)塊狀元素
常用的塊狀元素有：
<div>鹤竭、<p>踊餐、<h1>...<h6>、<ol>臀稚、<ul>吝岭、<dl>、<table>吧寺、<address>窜管、<blockquote> 、<form>
常用的內(nèi)聯(lián)元素有：
<a>稚机、<span>幕帆、<br>、<i>赖条、<em>失乾、<strong>常熙、<label>、<q>碱茁、<var>裸卫、<cite>、<code>
常用的內(nèi)聯(lián)塊狀元素有：
<img>纽竣、<input>
2.塊狀元素：獨(dú)占一行 p{ display:block;}
3.內(nèi)聯(lián)元素：我要和你站在一起 div{display:inline}
內(nèi)聯(lián)元素特點(diǎn)：
1墓贿、和其他元素都在一行上；
2退个、元素的高度募壕、寬度及頂部和底部邊距不可設(shè)置；
3语盈、元素的寬度就是它包含的文字或圖片的寬度舱馅，不可改變。
4.內(nèi)聯(lián)塊狀元素：div{ display:inline-block;}
inline-block 元素特點(diǎn)：
1刀荒、和其他元素都在一行上代嗤；
2、元素的高度缠借、寬度干毅、行高以及頂和底邊距都可設(shè)置。
3.不顯示元素：display:none;
4.邊距：margin:外邊距? padding:內(nèi)邊距 border:邊框
5.背景色
div{ background-color:green;}/***快內(nèi)元素***/
a{ background-color:blue}/*****行內(nèi)元素*****/
6.border添加邊框
（1）border-width:寬度泼返；thin | medium | thick（但不是很常用）硝逢，最常還是用像素（px）。
border-style:solid 實(shí)線? dashed：虛線? dotted:點(diǎn)線
border-color:#CCC? 十六進(jìn)制顏色
p{ 2px dotted #ccc}
（2）邊框：
border-top:1px solid red;腳下踩線
border-right:1px solid red;
border-left:1px solid red;
