引入方式及其權重： 行間樣式(1000)>內嵌式樣式》外聯樣式
!important(infinity)>id選擇器(100)>class選擇器(10)>標籤選擇器(1)>萬用字元選擇器(0)
屬性選擇器=class選擇器=偽類選擇器
父子選擇器 div span {};
直接子元素選擇器 div > span {};
並列選擇器 div.demo {};
分組選擇器 div,
span {};
偽類選擇器 a:hover {}; //滑鼠移上選中
字型屬性
字型大小：font-size: 16px;
字型粗細：font-weight: bold;
字型樣式：font-style: italic;
字型型別：font-family: 『宋體』;
字型顏色：color：red;
文字屬性
文字對齊：text-align: center;
強制文字不換行：white-space: nowrap;
同行文字中軸線： vertical-align: 20px;/middle;
//單行文字所佔高度等於容器高度，文字會垂直居中於容器中
文字行高：line-height: 100px;
//em相對於父級元素font-size rem相對於根元素font-size
文字首行縮排： text-indent: 2em;
文字下劃線：text-decoration: underline;
滑鼠游標屬性 cursor: pointer; //滑鼠移上變小手
邊框屬性
border: 1px solid #000;
圓角屬性：border-radius: 50%;
用邊框屬性畫三角形、梯形
div
透明色 color：transparent；
標準盒模型
//absolute脫離原來位置，相對於最近的有定位的父級進行定位,如果沒有相對文件
//relative保留原位置，相對於原來位置進行定位
//一般用relative當參照物，用absolute定位
//fixed固定定位，相對於瀏覽器視窗定位
position: absolute;/relative;/fixed;
定位元素層級屬性：z-index: 1;
水平垂直居中
div
<
/style>
='right'
>
<
/div>
='right'
>
<
/div>
.right
.left
<
/style>
position:absolute;
display: inline-block;
float: left;/right;
overflow:hidden;
margin塌陷解決方案
以上觸發條件之一
margin合併解決方案
下方元素的margin重新計算加上上方的元素的margin
浮動屬性 float: left;/right;
浮動元素產生浮動流，塊級元素看不到他們
bfc元素和文字類元素及文字都能看到浮動元素
浮動塌陷解決方案
清除浮動流 clear: both; 能清除浮動的只能是塊級元素
給父級元素新增偽類屬性
.clear::after
3.讓父級元素觸發bfc
偽元素
偽元素天生存在每個元素內（before和after）且是行級元素
可以通過css偽類選擇器選中
div::before{}; div::after{};
單行溢位文字打點
三件套:強制文字不換行；溢位部分隱藏；文字溢位隱藏部分打點
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
背景屬性
background-image: url( );
background-size: 100px 100px;
background-repeat: no-repeat;
background-position: 100px 100px;/left center;
當css未載入文字代替（僅設定背景時）
方案一：文字縮排到容器外部；強制文字不換行；溢位隱藏；
text-indent: 100em; white-space: nowrap; overflow: hidden;
方案二：用padding-top代替原本的高度;
背景會填充到padding上，文字會溢位隱藏
height: 0; padding-top: 100px; overflow: hidden;
body預設margin為8px;
設定了position/float的元素會被自動轉換成inline-block;
初始化文字設定：text-decoration: none;
行級元素只能套行級元素；塊級元素可套任何元素（p標籤不能套塊級元素）
a標籤不可巢狀a標籤
CSS層疊樣式表
一般說來所有樣式有下面的規則 第四個最有優先性 1 browser default 瀏覽器預設 2 external style sheet 外部樣式表 3 internal style sheet inside the 瀏覽器將從mystyle.css檔案中讀採樣式定義資訊，並根據它來格式化文件 ...
CSS（層疊樣式表）
一.css是增加html的樣式,擁有對網頁物件和模型樣式編輯的能力 1 在html中引入css有3種方式 1.外部樣式表 2.內部樣式表 3.內聯樣式表 2 css選擇元素的方式 1.元素選擇器 通過元素名字進行選擇 2.id選擇器 3.class選擇器 4.子元素選擇器 5.相鄰選擇器 如果需要選...
CSS層疊樣式表
html主要控制內容 css主要控制格式。樣式表是用來指定樣式資訊的句法機制。之所以將css稱為層疊樣式表，是因為它可以在3個層次上進行定義。內聯樣式表位於開始標籤中，其設定只對該元素起作用 文件樣式表位於文件的頭部區域，能夠作用於文件的整個主體。文件樣式表的說明是作為乙個 3.通用選擇器 不管什麼...