使用width來設(shè)置盒子內(nèi)容區(qū)的寬度
使用來設(shè)置盒子內(nèi)容區(qū)的高度
width和只是設(shè)置的盒子內(nèi)容區(qū)的大小，而不是盒子的整個(gè)大小，盒子可見框的大小由內(nèi)容區(qū)，內(nèi)邊距和邊框共同決定
為元素設(shè)置邊框
要為一個(gè)元素設(shè)置邊框必須指定三個(gè)樣式
-width:邊框的寬度
-color:邊框顏色
-style:邊框的樣式
使用-width可以分別指定四個(gè)邊框的寬度
如果在-width指定了四個(gè)值
則四個(gè)值會(huì)分別設(shè)置給上、右、下、左，按照順時(shí)針的方向設(shè)置的
如果指定三個(gè)值
則三個(gè)值會(huì)分別設(shè)置給上、左右、下
如果指定兩個(gè)值
則兩個(gè)值會(huì)分別設(shè)置給上下、左右
如果指定一個(gè)值，則四邊全都是該值
除了-width，CSS中還提供了四個(gè)-xxx-width
xxx的值可能是top right left
專門用來設(shè)置指定邊的寬度
* 設(shè)置邊框的顏色
* 和寬度一樣，color也提供四個(gè)方向的樣式，可以分別指定顏色
例如：-color: red;
/*-color: red blue;*/
/*-color: red ;*/
/*-color: red ;*/
格式和邊框設(shè)置顏色相同.
* 設(shè)置邊框的樣式
* 可選值：
* none，默認(rèn)值，沒有邊框
* solid 實(shí)線
* 點(diǎn)狀邊框
* 虛線
* 雙線
*
* style也可以分別指定四個(gè)邊的邊框樣式，規(guī)則和width一致，同時(shí)它也提供-xxx-style四個(gè)樣式css盒子中內(nèi)容邊框?qū)傩?/strong>，來分別設(shè)置四個(gè)邊
設(shè)置邊框
大部分的瀏覽器中，邊框的寬度和顏色都是有默認(rèn)值，而邊框的樣式默認(rèn)值都是none
*/
/* -width: 10px;
-color: red;
-style: solid; */
/*
- 邊框的簡(jiǎn)寫樣式，通過它可以同時(shí)設(shè)置四個(gè)邊框的樣式，寬度，顏色
- 而且沒有任何的順序要求
- 一指定就是同時(shí)指定四個(gè)邊不能分別指定
使用可以同時(shí)設(shè)置四個(gè)邊框的樣式，規(guī)則和-width一致
*/
/*: 100px;*/
/*: 100px 200px;*/
/*: 100px 200px 300px;*/
外邊距：
外邊距指的是當(dāng)前盒子與其他盒子之間的距離，他不會(huì)影響可見框的大小，而是會(huì)影響到盒子的位置
盒子有四個(gè)方向的外邊距：
-top
-right
-
-left
由于頁(yè)面中的元素都是靠左靠上擺放的，所以注意當(dāng)我們?cè)O(shè)置上和左外邊距時(shí)css盒子中內(nèi)容邊框?qū)傩?/strong>，會(huì)導(dǎo)致盒子自身的位置發(fā)生改變，而如果是設(shè)置右和下外邊距會(huì)改變其他盒子的位置
*/
/*設(shè)置上外邊距，即盒子的上邊框與其他盒子的距離*/
/*-top: 100px;*/
/*左外邊距*/
/*-left: 100px;*/
/*設(shè)置右和下外邊距*/
/*-right: 100px;
-: 100px;*/
/*
外邊距也可以指定為一個(gè)負(fù)值，如果外邊距設(shè)置的是負(fù)值，則元素會(huì)向反方向移動(dòng)
所謂的外邊距重疊指兄弟元素之間的相鄰?fù)膺吘鄷?huì)取最大值而不是取和
如果父子元素的垂直外邊距相鄰了，則子元素的外邊距會(huì)設(shè)置給父元素
.box3{
width: 200px;
: 100px;
-color: ;
/*為box3設(shè)置一個(gè)上邊框*/
/*-top: 1px red solid;*/
/*-top: 1px;*/
-top: 100px;
}
.box4{
width: 100px;
: 100px;
-color: ;
/*為子元素設(shè)置一個(gè)上外邊距，使子元素的位置下移*/
/*-top: 100px;*/
瀏覽器為了在頁(yè)面中沒有樣式時(shí)，也可以有一個(gè)比較好的顯示效果，所以為很多的元素都設(shè)置了一些默認(rèn)的和，而它的這些默認(rèn)樣式，正常情況下我們是不需要使用的。
所以我們往往在編寫樣式之前需要將瀏覽器中的默認(rèn)的和統(tǒng)統(tǒng)的去掉
格式：
*{
: 0;
: 0;
}