css核心樣式
粗細font-weight作用:設定文字是否加粗顯示
屬性名: font-weight, 屬於font屬性的乙個單-屬性
屬性值有兩種方式:單詞型別、數字型別
單詞型別
數字型別100-900之間的整百數字
數字越大，文字顯示越粗
其中400等價於normal, 700等價於bold
字型風格font-style作用:設定文字是否斜體顯示
屬性名: font-style, 屬於font屬性的乙個單- - 屬性
屬性值:單詞
行高line-height作用:設定的是一行文字實際占有的高度，文字字型大小在行高中是垂直居中的
屬性名: line-height, 屬於font屬性的-乙個單一屬性
字型綜合font字型、字型大小、行高、加粗、斜體都是font綜合屬性的單一屬性
font屬性五個單一屬性的值可以進行合寫，屬性值可以有2到多個，值之間用空格進行分隔
寫法一font進行綜合書寫時，必須有字型大小和字型參與，而且必須字型大小在前，字型在後，不能顛倒順序
如：font:14px "宋體"；
寫法二font屬性經常對字型、字型大小、行高進行合寫，書寫順序必須是字型大小、行高、字型，字型大小和行高之間必須用/進行分隔
如：font：14px/28px "宋體"
寫法三如果font屬性需要設定加粗和斜體，兩個屬性值只能寫在最前面，兩個值之間可以互換位置，後面的字型大小、行高、字型不能更改位置
如： font： bold italic 14px/28px "宋體"；
水平對其 text-aligns
作用：設定文字水平方向的對齊
在盒子中，不**本是單行還是多行，都會對應方向對齊
屬性值：三個方向的單詞
文字修飾text-decoration作用:設定文字整體是否有線條的修飾效果
文字縮緊作用:設定段落首行是否進行縮排
盒模型又叫框模型包含了五個用來描述盒子位置、尺寸的屬性，分別是寬度width、高度height、內邊距、padding、邊框border、外邊距margin
常見盒模型區域
盒模型的屬性中，根據不同屬性的效果，可以劃分區域:
書寫元素內容區域: width+height
盒子可以實體化的區域: width+height+padding+border
盒子實際佔位的位置: width+height+padding+border+margin
注：深刻理解盒模型圖
盒模型寬度 width
作用：設定可以新增元素內容的區域寬度
特殊應用
如果乙個元素不新增width屬性，預設屬性值為auto,不同的元素瀏覽器會根據其特點自動計算出實際寬度，例如
元素等獨佔- -行的，其width屬性的值會自
動撐滿父元素的width區域，如果是元素等不需要獨佔一行的，其width屬性的值是內部元素內容自動撐開的寬度
盒模型高度 height作用：設定可以新增元素內容的區域的寬度
特殊應用
如果乙個元素不新增height屬性，預設屬性值為auto,瀏覽器會自動計算出實際
高度，也就是是內部元素內容自動撐開的高度。元素的高度自適應內部內容的高度
盒模型內邊距 padding作用:設定的是元素的邊框內部到寬高區域之間的距離
特點:可以去載入背景，不能書寫巢狀的內容
屬性值:常用px為單位的數值
padding是-個復合屬性，可以根據內邊距的方向不同劃分為四個方向的單屬性
單一屬性：書寫四個方向單一屬性時，一般是按照順時針規律書寫：上、右、下、左
簡寫padding屬性值:可以有1-4個值，值之間用空格進行分隔
根據四個方向屬性值不同，padding有多種值的書寫表示方法
根據padding的屬性值的個數不同，區分了四種表示法:四值法 p 上右下左
三值法 p 上 左右 下
二值法 p 上下 左右
單值法 設定屬性值只有乙個，分配方向上右下左，四邊的值相同
製作三邊內邊距相同，一邊不同方法①:使用四值法、三值法，進行屬性值設定
方法②:利用綜合屬性和單一屬性之間的層疊，對綜合屬性設定單值法，將四邊內邊距設定相同，在後面使用單一屬性寫法，再次定義某個方向的屬性值不同，可以實現單一屬性層疊綜合屬性的一部分
其中第二種用法更加靈活，推薦使用，使用過程中注意書寫順序，單一屬性必須書寫在後，才能層疊掉綜合屬性中重複的部分
盒模型 border作用:設定的是內邊距外面的邊界區域，作為盒子的實體化的最外層
屬性值:由三個值組成，分為線的寬度、線的形狀、線的顏色
border 屬性是乙個復合屬性，根據劃分依據不同可以有兩種單一屬性的劃分分布
p 半透明其他應用
同樣，可以給文字和邊框透明，都是ragb的格式來寫
背景縮放 background-size
通過background-size設定背景的尺寸，就像我們設定的尺寸一樣，在移動web開發中做螢幕適配應用非常廣泛屬性值說明多背景css3中規定，乙個盒子上，可以新增多個背景
background-image的屬性值書寫時，以逗號分隔多背景的url路徑位址
注意:背景載入時，先寫的背景壓蓋後寫的背景
background-image: url(/i/bg_flower.gif),url(/i/bg_flower_2.gif);
偏移量屬性定位的元素要想發生位置的移動，必須搭配偏移量屬性進行設定
水平方向: left、 right
垂直方向: top、bottom
屬性值:常用px為單位的數值，或者百分比
相對定位 relative相對定位的性質性質:相對定位的元素不脫離標籤的原始狀態(標準流、 浮動)，不會讓出原來占有的位置
元素顯示效果上，原位留坑，形影分離
注意事項注意1:偏移量屬性的值是區分正負的
正數：表示偏移方向與屬性名相反
負數： 表示偏移方向與屬性名相同
注意②:同乙個方向，不能設定兩個偏移量屬性，如果水平方向同時設定了left 和right屬性，只會載入left屬性。垂直方向只載入top屬性
建議：書寫時從水平方向和垂直方向各挑乙個屬性進行組合
注意③:由於相對定位的參考元素是自身，left 的正值等價於right 的負值，top 的正值等價於bottom的負值
為了方便記憶，可以只選擇left、top組合
position: relative; right: -50px; bottom: -50px; 等價於 position: relative; left: 50px; top: 50px;
絕對定位屬性值: absolute, 絕對的意思
參考元素:參考的是距離最近的有定位的祖先元素，如果祖先都沒有定位，參考
必須搭配偏移量屬性才會發生位置移動
性質：絕對定位的元素脫離標準流，會讓出標準流位置，可以設定寬高，也可以隨時定義位置，絕對定位的元素不設定寬高只能被內容撐開
注意1: 絕對定位的參考元素是不固定的，不同的參考元素以及不同的偏移量組合，會導致絕對定位元素的參考點不同，具體位移效果不同
注意2: 在絕對定位中，由於參考點不同，left正值不再等價於right的負值
身的對比點是盒子的所有盒模型屬性最外面的左上角或右上角
第二，如果有bottom參與的絕對定位，參考點是
頁面首屏的左下頂點或右下頂點。對比點是盒子的所有盒模型屬性最外面的左下角或右下角
實際應用中，如果以
為參考元素，不同解析度的瀏覽器中，絕對定位的元素位置是不同的，所以較少使用作為參考元素
祖先級為參考元素如果祖先級中有定位的元素，就不會去參考
根據絕對定位的參考元素的定位型別不同，有三種定位組合方式:子絕父相、子絕父絕、子絕父固，由於相對定位的祖先級位置更穩定，大多使用子絕父相的情況
固定定位屬性值: fixed, 固定的意思
參考元素:瀏覽器視窗
參考點:瀏覽器視窗的四個頂點。跟偏移量組合方向有關
由於瀏覽器視窗的四個頂點位置不會發生變化，會導致固定定位的元素會始終顯示在定位位置
性質：固定定位的元素脫離標準流，讓出標準流位置，可以設定寬高，根據偏移量屬性可以任意設定在瀏覽器視窗的位置，固定定位的元素會始終顯示在瀏覽器視窗上
定位應用、壓蓋、居中
positionl: absolute;
left: 50%;
width: 100px;
擴充套件應用
①解決標準流中，寬的子盒子在窄的父盒子中的居中，可以設定大的子盒子相對定位，利用相對定位居中的方法進行居中
.box p②浮的元素居中，在不改變原始浮動狀態情況下，可以利用相對定位居中方法
定位壓蓋順序 z-index預設壓蓋順序定位的元素不區分定位型別，都會去壓蓋標準流或者浮動的元素
如果都是定位元素，在html中後寫的定位壓蓋先寫的定位
自定義壓蓋順序注意事項①屬性值大的會壓蓋屬性值小的，設定z-index屬性的會壓蓋沒有設定的
②如果屬性值相同，比較html書寫順序，後寫的壓蓋先寫的
③z-index屬性只能設定給定位的元素才會生效，如果給沒有定位的元素設定，不會生效
④父子盒模型中，如果父子盒子都進行了定位，與其他的父子級有壓蓋的部分:父級盒子:如果不設定z-index,後寫的壓蓋先寫的;如果設定了z-index,值大的壓蓋值小
的靜態輪播圖
滑鼠變銷售的狀態： cursorc: pointer
同級css使用乙個樣式 純CSS樣式寫乙個內凹圓
廢話不多說，直接上效果圖！這是html 單元管理 車位管理 商鋪管理 這是css 內凹圓 property left list list one list one before list one after list one after,list one before list one div be...
css樣式的使用一
inaline webkit line clamp n intwoline 設定容器樣式 white space no wrap。display webkit box webkit box orient vertical overflow hidden text overflow ellipsis ...
僅使用HTML元素通過CSS樣式製作乙個小三角
製作小三角有兩種常用的方式，1 是css3種的方法，通過旋轉乙個div元素45度，然後定位到外部div的某一邊，把多餘的用overflow hidden 遮住，來獲取乙個三角形，但是這種方法相容性不是很好，而且之前的瀏覽器也沒有旋轉屬性，2 通過邊框屬性,來製作小三角.我們可以看到,邊框和邊框之間是...