CSS屬性操作

標籤：預設值   img   方式   func   其他屬性   決定   osi   alt   無效   

一、css文本顏色的表示方式

　　1、十六進位值 - 如: ＃FF0000

　　2、一個RGB值 - 如: RGB(255,0,0,0)     （紅，綠，藍，透明度）

　　3、顏色的名稱 - 如:  red     （建議使用）

　　4、之前的屬性操作方式：

　　　　colour:調整字型顏色；background-colour:調整字型背景顏色；font-size:調整字型大小；border：調整字型邊框厚度，樣式，顏色；

　　　　width:調整架構寬度；height:調整架構高度

二、文本水平對齊（text-align屬性

　　1、left      把文本排列到左邊。預設值：由瀏覽器決定。

　　2、right    把文本排列到右邊。

　　3、center 把文本排列到中間。

　　4、justify 實現左右對齊文字效果。

三、文本其他屬性

　　1、font-size: 10px;設定文本中文字大小

　　2、 font-family: ‘Lucida Bright‘ 設定字型類型

　　3、font-weight: lighter/bold/border/ 設定字型粗細（細中粗），也可用數字調節

　　4、font-style: oblique 設定字型為斜體

　　5、 line-height: 200px; 文本垂直置中，但是必須和文字框高度一致。

　　6、 vertical-align:－4px 設定元素內容的垂直對齊 ,只對行內元素有效，對區塊層級元素無效

　　7、 text-decoration:none text-decoration 屬性用來設定或刪除文本的裝飾。主要是用來刪除連結的底線

　　8、text-indent: 150px; 首行縮排150px

　　9、letter-spacing: 10px; 字母直接的間距

　　10、word-spacing: 20px; 單詞直接的間距

　　11、text-transform: capitalize/uppercase/lowercase ; 文本轉換，用於所有字句變成大寫或小寫字母，或每個單詞的首字母大寫

　　12、預設圖片是按照基準對齊，可以通過vertical-align:的方法改變圖片的對齊。

　　　　

四、css背景屬性

　　1、background-color 設定背景顏色

　　2、background-image 以圖片設定背景顏色，橫縱都填，不夠圖片補全

　　3、background-repeat：repea-x橫向填充圖片

　　4、background-repeat：repea-x縱向填充圖片

　　5、background-repeat：no-repea不會填充圖片，只有一張圖片

　　6、background-position：100px 100px 上左，可center center 置中

　　7、簡寫：

　　　　

五、邊框屬性

　　1、border-width 邊框的寬度

　　2、border-style (required) 邊框的類型，即以什麼線把邊框包起來，實線，虛線等

　　3、border-color 邊框的顏色

　　4、簡寫：

　　　　border:寬度 顏色 類型  （不區分順序，瀏覽器預設會識別）

　　5、border-right:寬度 顏色 類型  這隻是給邊框的最右邊的一條線設定屬性。

　　6、border-radius: 80% 邊框圓潤度

六、列表屬性

　　1、list-style-type         設定清單項目標誌的類型。

　　2、list - style - image   將圖象設定為清單項目標誌。 　　3、list - style - position 設定列表中清單項目標誌的位置。 　　4、list - style      簡寫屬性。用於把所有用於列表的屬性設定於一個聲明中　　5、 list - style：none     設定清單項目標誌類型為空白     七、外邊距和內邊距屬性　　1、盒子模型　　　　

　　　　1.1、margin: 用於控制元素與元素之間的距離；

　　　　1.2、padding:  用於控制內容與邊框之間的距離；  

　　　　1.3、Border(邊框):  圍繞在內邊距和內容外的邊框。

　　　　1.4、Content(內容):   盒子的內容，顯示文本和映像。

　　2、eg:

　　　　

 

 

CSS屬性操作