css樣式筆記

2021-09-20 04:14:07 字數 1534 閱讀 9592

css**部分:

使用border屬性可以在css中設定**邊框。 border:1px solid black;1px指的是**邊框線粗細程度,solid指的是邊框樣式,solid是固體實線,

black指的是邊框線的顏色。

例子:firstname

lastname

bill

gates

steven

jobs

border-collapse屬性可以使**的邊框合併為乙個單一的邊框,一般與border:solid一起使用,不寫該屬性預設值為separate,即分開。

例子:table

table,th, td

通過width和height屬性可以修改**的寬度和高度。單位一般用百分比%和畫素px兩種。

例子:table

thtext-align屬性可以設定**中的文字水平對齊。text-align常見屬性值為left,right,center。

例子:td

css 定位屬性中的vertical-align設定元素的垂直方式。屬性值有baseline,該值為預設值,元素放在父元素的基線上。常見屬性值:

top,b0ttom,middle。

例子:td

padding屬性可以設定**中內容與邊框的距離。

tdbackground-color屬性設定**的背景顏色,color屬性設定文字顏色。

例子:th

位置的屬性:

position 設定元件位置的排列方式 屬性值absolute、relative、static

width 指定元件寬度 寬度數值

height 指定元件高度 高度數值

left 指定元件與左邊界的距離(x座標) 距離數值

top 指定元件與上邊界的距離(y座標) 距離數值

overflow 超出邊界的顯示方式 距離數值

visibility設定是否顯示 屬性值visible(可見的)、hidden、inherit(繼承)

例子:a:link 未鏈結前超連結文字顏色是黑色

a:visited 已鏈結過的超連結文字顏色為藍色,沒有邊框

a:active 啟用時超連結文字顏色為黃色

a:hover 當滑鼠移到鏈結時的超連結樣式是綠色實線、

寬1px的邊框,文字不新增下劃線

a選擇器中設定的樣式會繼承給a:link、a:visited、a:active和a:hover選擇器,因此上例語句中a:link、a:active都

沒有設定邊框,但是瀏覽網頁時也會產生邊框,如果不希望有邊框,只要加上border:0px;就可以了,一般使用a選擇器和

a:hover選擇器就可以做出超連結的效果。

cursor屬性可以控制滑鼠游標圖示

例子:a

上面的語句表示滑鼠游標在超連結區域會呈現crosshair的游標圖案。

display屬性常用的設定值有兩種,block 區塊固定大小,當文字超過區塊時,文字會換行。

inline 區塊隨內容變動,當文字超過區塊時,區塊會擴大。

CSS樣式小筆記

樣式 偏斜體 italic 斜體 normal 正常 行高 正常 單位 px pd em 粗細 粗體 lighter 細體 normal 正常 變體 小型大寫字母 normal 正常 大小寫 首字母大寫 uppercase 大寫 lowercase 小寫 none 無 修飾 下劃線 overline...

CSS樣式學習筆記?

如何利用css做到 混排?把文字當作處理,當作文書處理 為了保證不佔一行 或乙個div 需要用float left這個樣式,寫海報 首字母下沉 效果需要用到這個樣式 利用標籤做導航標籤?設定list style type none float left 可以不需要標籤,如果有則也需要將list st...

CSS筆記之樣式

總結一下css樣式,做如下的筆記。css樣式 1.背景 background color 背景色 可以接受任何合法的顏色值,其預設值是 transparent 透明 background image 背景影象 如body 預設值是 none background repeat 背景重複 repeat...