溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶(hù)服務(wù)條款》

常用CSS代碼大全有哪些

發(fā)布時(shí)間:2021-01-29 14:12:14 來(lái)源:億速云 閱讀:232 作者:小新 欄目:web開(kāi)發(fā)

這篇文章將為大家詳細(xì)講解有關(guān)常用CSS代碼大全有哪些,小編覺(jué)得挺實(shí)用的,因此分享給大家做個(gè)參考,希望大家閱讀完這篇文章后可以有所收獲。

一.文本設(shè)置

1、font-size: 字號(hào)參數(shù)

2、font-style: 字體格式

3、font-weight: 字體粗細(xì)

4、顏色屬性

color: 參數(shù)

注意使用網(wǎng)頁(yè)安全色

二、超鏈接設(shè)置

text-decoration: 參數(shù)

主要用途是改變?yōu)g覽器顯示文字鏈接時(shí)的下劃線(xiàn)。

參數(shù)取值范圍:

underline:為文字加下劃線(xiàn)

overline:為文字加上劃線(xiàn)

line-through:為文字加刪除線(xiàn)

blink:使文字閃爍

none:不顯示上述任何效果

三、背景

1、背景顏色

background-color: 參數(shù)

2、背景圖片

background-image: url(URL)

URL就是背景圖片的存放路徑,none表示無(wú)。

3、背景圖片重復(fù)

background-repeat: 參數(shù)

參數(shù)取值范圍 :

no-repeat:不重復(fù)平鋪背景圖片

repeat-x:使圖片只在水平方向上平鋪

repeat-y:使圖片只在垂直方向上平鋪

如果不指定背景圖片重復(fù)屬性,瀏覽器默認(rèn)的是背景圖片向水平、垂直兩個(gè)方向上平鋪。

4、背景圖片固定

背景圖片固定控制背景圖片是否隨網(wǎng)頁(yè)的滾動(dòng)而滾動(dòng)。如果不設(shè)置背景圖片固定屬性,瀏覽器默認(rèn)背景圖片隨網(wǎng)頁(yè)的滾動(dòng)而滾動(dòng)。為了避免過(guò)于花哨的背景圖片在滾動(dòng)時(shí)轉(zhuǎn)移瀏覽者的注意力,一般都設(shè)為固定

background-attachment: 參數(shù)

參數(shù)取值范圍:

fixed:網(wǎng)頁(yè)滾動(dòng)時(shí),背景圖片相對(duì)于瀏覽器的窗口而言,固定不動(dòng)

scroll:網(wǎng)頁(yè)滾動(dòng)時(shí),背景圖片相對(duì)于瀏覽器的窗口而言,一起滾動(dòng)

四、區(qū)塊

1、單詞間距

word-spacing: 間隔距離

2、字母間距

letter-spacing: 字母間距

3、文本對(duì)齊

text-align: 參數(shù)

參數(shù)的取值:

left:左對(duì)齊

right:右對(duì)齊

center:居中對(duì)齊

justify:相對(duì)左右對(duì)齊

4、垂直對(duì)齊

vertical-align: 參數(shù)

top:頂對(duì)齊

bottom:底對(duì)齊

text-top:相對(duì)文本頂對(duì)齊

text-bottom:相對(duì)文本底對(duì)齊

baseline:基準(zhǔn)線(xiàn)對(duì)齊

middle:中心對(duì)齊

sub:以下標(biāo)的形式顯示

super:以上標(biāo)的形式顯示

5、文本縮進(jìn)

text-indent: 縮進(jìn)距離

12px相當(dāng)于一個(gè)文字距離

6、空格

white-space: 參數(shù)

normal 正常

pre 保留

nowrap 不換行

7、顯示樣式

display: 參數(shù)

參數(shù)取值范圍:

block:塊級(jí)元素,在對(duì)象前后都換行

inline:在對(duì)象前后都不換行

list-item:在對(duì)象前后都換行,增加了項(xiàng)目符號(hào)

none:無(wú)顯示

五、方框

1、height 高度

2、width 寬度

3、padding 內(nèi)邊距

4、margin 外邊距

5、float(浮動(dòng)):可以讓塊級(jí)元素在一行中排列,例如橫向菜單。

6、clear 清除浮動(dòng)

六、邊框

1、樣式

border style 參數(shù)

邊框樣式的參數(shù):

none:無(wú)邊框

dotted:邊框?yàn)辄c(diǎn)線(xiàn)

dashed:邊框?yàn)殚L(zhǎng)短線(xiàn)

solid:邊框?yàn)閷?shí)線(xiàn)

double:邊框?yàn)殡p線(xiàn)

2、寬度

border width 參數(shù)

3、顏色

border color 參數(shù)

七、列表

list-style-type 列表樣式

不同瀏覽器的列表符可能不相同,可能會(huì)影響到網(wǎng)頁(yè),所以網(wǎng)頁(yè)中的列表大多都是由背景圖片顯示。

控制用戶(hù)界面的樣式

八、鼠標(biāo)

cursor:鼠標(biāo)形狀參數(shù)

CSS鼠標(biāo)形狀參數(shù)表:

鼠標(biāo)形狀:CSS代碼

style="cursor:hand"      手形

style="cursor:crosshair"   十字形

style="cursor:text"      文本形

style="cursor:wait"      沙漏形

style="cursor:move"     十字箭頭形:

style="cursor:help"      問(wèn)號(hào)形

style="cursor:e-resize"    右箭頭形

style="cursor:n-resize"    上箭頭形

style="cursor:nw-resize"   左上箭頭形

style="cursor:w-resize"    左箭頭形

style="cursor:s-resize"    下箭頭形

style="cursor:se-resize"   右下箭頭形

style="cursor:sw-resize"   左下箭頭形

關(guān)于“常用CSS代碼大全有哪些”這篇文章就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,使各位可以學(xué)到更多知識(shí),如果覺(jué)得文章不錯(cuò),請(qǐng)把它分享出去讓更多的人看到。

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

css
AI