背景
(1)background-color:背景顏色
(2)background-image:url("路徑");
(3)background-repeat:複製屬性,幾個常用取值
①repeat,重複,預設
②no-repeat,不重複
③repeat-x,橫軸重複
④repeat-y,縱軸重複
⑤round,迴圈
(4)background-position:位置
①top,頂部
②bottom,底部
③right,右邊
④left,左邊
⑤center,中心
background-color: #a1ff54;
background-image: url("");
background-repeat:repeat-x;
background-position: center;
當然可以將一組屬性封裝到乙個屬性background中,表達更加簡潔。有書寫順序:
background-color background-image,background-repeat background-position
background: gainsboro
url("") no-repeat right top; 尺寸
(1)height:高度
(2)width:寬度
div
(3)max-height最大高度
(4)max-width最大寬度
(5)min-height最小高度
(6)min-width最小寬度顯示
(1)隱藏元素的方法
①visibility:hidden,僅僅隱藏內容,該元素所佔的位置依然存在。
②dispaly:none,不僅隱藏內容,而且隱藏一切格式。
(2)display可以設定元素的顯示模式。
①inline,將塊級元素以內聯元素的形式顯示,通俗的講就是在一行顯示,此時width和height屬性無效,其空間取決於元素的內容。
②inline-block,將塊級元素以內聯的形式來顯示,同是兼具塊級元素的某些特徵,比如可以使用width和height屬性設定所佔位置大小。
③block,可以將內聯元素以塊級元素的形式來顯示,自己理解的就是可以換行。邊距
(1)margin外邊距
①margin:**px;表示上下左右外邊距都是**px
margin: 30px
margin-top
margin-right
margin-bottom
margin-left
③一起設定四個方向的外邊距,順序分別是上右下左。
margin: 10px 20px 30px 40px;
(2)padding內邊距,同margin
(3)border邊框
順序是border-width:10px;寬度
border-style 邊框的樣式
①solid實線
②dotted虛線
③double雙實線
④groove 凹槽。就像相框一樣,看著像立體的。
border-color: red;border: 10px dashed red;
(4)outline輪廓
outline: 5px dotted gold; 定位
定位方式有:
static(靜態的),預設。無定位,元素正場出現在流中。
divdiv>靜態定位的演示
<.body>
fixed(固定的),
relative(相對的),
<style
type=
"text/css">
#div1
#div2
style>
<style
type=
"text/css">
#div1
#div2
style>
從結果可以看出,fixed定位會將元素從流中摘出來,定位取決去left和top
重新定位之後可能會出現重疊,通過z-index可以調整其順序,但是
#div1
#div2
#div2
#div3
style>
absolute(絕對的),絕對定位的元素也會從流中摘出來,依靠left屬性進行定位,與fixed類似,但是的參照物不同。fixed參照根元素(html),absolute參照物是父容器
#div1
#div2
#div3
style>
CSS基礎知識 backgroung(背景)
背景圖 background 縮寫形式 background color 背景顏色 語法 background color 顏色 background image 背景 語法 background image url background repeat 背景圖重複位置 其屬性值可以為 repeat ...
CSS基礎知識總結
1 使用css 2 css的優勢是容易修改樣式.標籤與css搭配起來使用能夠較好地修改格式。css中除了在標籤中編碼選擇器外,也可以在html本身的標籤中使用屬性來設定css格式。3 外部css的使用 4 css的優先順序基本原則是就近原則 因此在書寫是一般講外部式放在最前 在有相同權值的情況下,優...
css基礎知識總結
一.權重的比較 1.元素被選中 id選擇器 類選擇器 標籤選擇器 2.元素未選中 誰離目標近選誰 二.元素的居中 1.居中 文字居中 水平居中 單行 多行 屬性 text align center 垂直居中 單行文字 line height height 設定行高等於個高 多行文字 不設定高度,同時...