2023青島數(shù)字文化應(yīng)用發(fā)展大會免費(fèi)多久？
2024-08-30
網(wǎng)站首頁
手機(jī)版
更新時間：2024-08-30 00:03:27作者：佚名
font：復(fù)合屬性。設(shè)置或檢索對象中的文本特征。
font-style：設(shè)置或檢索對象中的字體樣式。用于定義字體的風(fēng)格，如：斜體（italic）等等。
font-variant：設(shè)置或檢索對象中的文本是否為小型的大寫字母。
font-weight：設(shè)置或檢索對象中的文本字體的粗細(xì)。
font-size：設(shè)置或檢索對象中的字體尺寸，在開發(fā)中12px字體最常用。
font-family ：設(shè)置或檢索用于對象中文本的字體名稱序列；用于定義字體的樣式，如黑體，宋體等等。
定義元素內(nèi)文字顏色
語法：color：顏色名|十六進(jìn)制|RGB
1>預(yù)定義的顏色值，如red,green,blue等。
2>十六進(jìn)制，如#FF0000，#FF6600等。實(shí)際工作中，十六進(jìn)制是最常用的定義顏色的方式。
3>RGB代碼，如紅色可以表示為rgb（255，0，0）或rgb(100%,0%,0%).
如：
div{color:red;}
div{color:#ff0000;}
div{color:rgb(255,0,0);}
div{color:rgba(255,0,0,.5);}
該屬性設(shè)置使用斜體、傾斜或正常字體。斜體字體通常定義為字體系列中的一個單獨(dú)的字體。理論上講，用戶代理可以根據(jù)正常字體計算一個斜體字體。
默認(rèn)值 normal
normal 正常字體
italic 斜體字
p{font-style:italic;}
通過像素來指定字體大小 1px=1像素
font-size：絕對單位|相對單位分別為：px像素|em/%
p{font-size:12px;}
默認(rèn)值 由瀏覽器確定
示例：
font-family：Microsoft YaHei;
font-family：“Microsoft YaHei”,”Simsun”，“SimHei”;
字體加粗除了用b和strong標(biāo)簽之外，可以使用CSS來實(shí)現(xiàn)。
normal：默認(rèn)值。定義標(biāo)準(zhǔn)的字符。
bold：定義粗體字符
bolder：定義更粗的字符
lighter：定義更細(xì)的字符
100~900：定義由粗到細(xì)的字符。400等同于normal，而700等同于 old 。
inherit：規(guī)定應(yīng)該從父元素繼承字體的粗細(xì)。
設(shè)置三個段落的字體的粗細(xì)：
p.nomal{font-weight:normal;}
p.thick{font-weight:bold;}
p.thicker{font-weight:900;}
設(shè)置字的間距(增加或減少)
該屬性定義了在文本字符框之間插入多少空間。由于字符字形通常比其字符要窄，指定長度值時，會調(diào)整字母之間通常的間隔。因此，normal就相當(dāng)于值為0.
如：div{letter-spacing：2px;}
normal：默認(rèn)。規(guī)定字符間沒有額外的空間。
length：定義字符間的固定空間（允許使用負(fù)值）。
inherit：規(guī)定應(yīng)該從父元素繼承l(wèi)etter-spacing屬性的值。
設(shè)置顏色的透明度，整個元素都會透明
默認(rèn)值1，取值為0-1
1為不透明，0為完全透明
示例：
p{opacity：0；}
隱藏一個元素，完全不顯示，但是會占空間，只是看不到
p{opacity:1;}
顯示一個元素 它和rgba中的”a“作用一樣
當(dāng)內(nèi)容溢出元素框時隱藏|自動|顯示滾動條
visible：默認(rèn)值。內(nèi)容不會被修剪，會呈現(xiàn)在元素框之外。
hidden：內(nèi)容會被修剪，并且其余內(nèi)容是不可見的。
scroll：內(nèi)容會被修剪，但是瀏覽器會顯示滾動條以便查看其余的內(nèi)容。
auto：如果內(nèi)容被修剪，則瀏覽器會顯示滾動條以便查看其余內(nèi)容。
inherit：規(guī)定應(yīng)該從父元素繼承overflow屬性的值。
設(shè)置overflow屬性代碼：
div
{
width：150px;
height:150px;
overflow:scroll;
}
讓溢出的文字以省略號顯示
p{height:20px; width:100px;background:#ddd;}
width-space：nowrap; 讓文字在同一行顯示，不換行
overflow：hidden； 溢出部分隱藏
text-overflow：ellipsis； 文字一處部分省略號顯示，另外一個值為clip