CSS第五部分 7.26

一秕磷、行高 (line-height)

1.行高不作用于文字上,作用于行上顷霹。

2.行高咪惠、字號(hào),一般都是偶數(shù)淋淀。(方便文字在盒子中居中)

3.行高=盒子高時(shí) 文字能夠居中遥昧。

5.多行文字居中時(shí),不能只設(shè)置行高,要根據(jù)計(jì)算加入padding炭臭。

6.font屬性:

1) 使用font屬性永脓,能夠?qū)?/b>字號(hào)、行高鞋仍、字體一起設(shè)置常摧。

font: 14px/24px宋體;

等價(jià)于三行語(yǔ)句:

font-size:14px; ?line-height:24px; ?font-family:"宋體";

2) 可以有無(wú)數(shù)個(gè)備選字體,用逗號(hào)隔開(kāi)威创,我們要將英語(yǔ)字體落午,放在最前面,這樣所有的中文肚豺,就不能匹配英語(yǔ)字體溃斋,就自動(dòng)的變?yōu)楹竺娴闹形淖煮w。

3)行高可以用百分比详炬,表示字號(hào)的百分之多少盐类。一般來(lái)說(shuō),都是大于100%的呛谜,因?yàn)樾懈咭欢ㄒ笥谧痔?hào)在跳。

font:12px/200%“宋體”

等價(jià)于

font:12px/24px“宋體”;

二、超級(jí)鏈接的美化

1.偽類:<a>即偽類

?:link表示隐岛,用戶沒(méi)有點(diǎn)擊過(guò)這個(gè)鏈接的樣式猫妙。是英語(yǔ)“鏈接”的意思。

:visited表示聚凹,用戶訪問(wèn)過(guò)了這個(gè)鏈接的樣式割坠。是英語(yǔ)“訪問(wèn)過(guò)的”的意思。

:hover表示妒牙,用戶鼠標(biāo)懸停的時(shí)候鏈接的樣式彼哼。是英語(yǔ)“懸停”的意思湘今。

:active表示敢朱,用戶用鼠標(biāo)點(diǎn)擊這個(gè)鏈接,但是不松手摩瞎,此刻的樣式拴签。是英語(yǔ)“激活”的意思。

一定要按順序?qū)懫烀牵〖记桑?b>lovehate蚓哩。

2.美化

a標(biāo)簽中,描述盒子上渴; 偽類中描述文字的樣式岸梨、背景喜颁。

最標(biāo)準(zhǔn)的,就是把link盛嘿、visited洛巢、hover都要寫。但是前端開(kāi)發(fā)工程師在大量的實(shí)踐中次兆,發(fā)現(xiàn)不寫link稿茉、visited瀏覽器也挺兼容。所以這些“老油條”們芥炭,就把a(bǔ)標(biāo)簽簡(jiǎn)化了:

a:link漓库、a:visited都是可以省略的,簡(jiǎn)寫在a標(biāo)簽里面园蝠。也就是說(shuō)渺蒿,a標(biāo)簽涵蓋了link、visited的狀態(tài)彪薛。

3,.background?

1) background-color?

用英語(yǔ)單詞來(lái)表示 簡(jiǎn)單顏色

用rgb方法來(lái)表示 ?紅”red茂装、“綠”green、“藍(lán)”blue善延。用逗號(hào)隔開(kāi)少态,r、g易遣、b的值彼妻,每個(gè)值的取值范圍0~255,一共256個(gè)值豆茫。

十六進(jìn)制表示法:十六進(jìn)制中侨歉,13表示1個(gè)16和3個(gè)1。 那就是19揩魂。這就是位權(quán)的概念幽邓。

十六進(jìn)制可以簡(jiǎn)化為3位,所有#aabbcc的形式火脉,能夠簡(jiǎn)化為#abc;

要記准昭蕖:

#000黑 ?#fff白 ?#f00紅 ?#333灰 ?#222深灰?? ?#ccc淺灰

4.background-image

格式:background-image:url(images/wuyifan.jpg);

自動(dòng)會(huì)平鋪滿,padding內(nèi)也有圖片忘分。?

5.background-repeat

background-repeat:no-repeat;不重復(fù)

background-repeat:repeat-x;橫向重復(fù)

background-repeat:repeat-y;縱向重復(fù)

6.background-position

背景定位屬性。

background-position:向右移動(dòng)量 向下移動(dòng)量; 圖片在盒子中的移動(dòng)量白修,可以是負(fù)數(shù)妒峦。

7.css精靈:css的背景定位來(lái)顯示需要顯示的圖片部分。

8.用單詞描述位置:

background-position:描述左右的詞兒? 描述上下的詞兒;

描述左右的詞兒:left兵睛、center肯骇、right

描述上下的詞兒:top窥浪、center、bottom

9.background-attachment

background-attachment:fixed; ?背景會(huì)被固定住笛丙,不會(huì)被滾動(dòng)條滾走漾脂。

10.綜合屬性

background:red url(1.jpg) no-repeat 100px 100px fixed;

等價(jià)于:

background-color:red;

background-image:url(1.jpg);

background-repeat:no-repeat;

background-position:100px 100px;

background-attachment:fixed;


第一次做博雅互動(dòng);

源代碼如下


?

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末胚鸯,一起剝皮案震驚了整個(gè)濱河市骨稿,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌姜钳,老刑警劉巖坦冠,帶你破解...
    沈念sama閱讀 207,113評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異哥桥,居然都是意外死亡辙浑,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,644評(píng)論 2 381
  • 文/潘曉璐 我一進(jìn)店門拟糕,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)判呕,“玉大人,你說(shuō)我怎么就攤上這事送滞∠啦荩” “怎么了?”我有些...
    開(kāi)封第一講書人閱讀 153,340評(píng)論 0 344
  • 文/不壞的土叔 我叫張陵累澡,是天一觀的道長(zhǎng)梦抢。 經(jīng)常有香客問(wèn)我,道長(zhǎng)愧哟,這世上最難降的妖魔是什么奥吩? 我笑而不...
    開(kāi)封第一講書人閱讀 55,449評(píng)論 1 279
  • 正文 為了忘掉前任,我火速辦了婚禮蕊梧,結(jié)果婚禮上霞赫,老公的妹妹穿的比我還像新娘。我一直安慰自己肥矢,他們只是感情好端衰,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,445評(píng)論 5 374
  • 文/花漫 我一把揭開(kāi)白布。 她就那樣靜靜地躺著甘改,像睡著了一般旅东。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上十艾,一...
    開(kāi)封第一講書人閱讀 49,166評(píng)論 1 284
  • 那天抵代,我揣著相機(jī)與錄音,去河邊找鬼忘嫉。 笑死荤牍,一個(gè)胖子當(dāng)著我的面吹牛案腺,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播康吵,決...
    沈念sama閱讀 38,442評(píng)論 3 401
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼劈榨,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了晦嵌?” 一聲冷哼從身側(cè)響起同辣,我...
    開(kāi)封第一講書人閱讀 37,105評(píng)論 0 261
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎耍铜,沒(méi)想到半個(gè)月后邑闺,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 43,601評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡棕兼,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,066評(píng)論 2 325
  • 正文 我和宋清朗相戀三年陡舅,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片伴挚。...
    茶點(diǎn)故事閱讀 38,161評(píng)論 1 334
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡靶衍,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出茎芋,到底是詐尸還是另有隱情颅眶,我是刑警寧澤,帶...
    沈念sama閱讀 33,792評(píng)論 4 323
  • 正文 年R本政府宣布田弥,位于F島的核電站涛酗,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏偷厦。R本人自食惡果不足惜商叹,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,351評(píng)論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望只泼。 院中可真熱鬧剖笙,春花似錦、人聲如沸请唱。這莊子的主人今日做“春日...
    開(kāi)封第一講書人閱讀 30,352評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)十绑。三九已至聚至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間本橙,已是汗流浹背晚岭。 一陣腳步聲響...
    開(kāi)封第一講書人閱讀 31,584評(píng)論 1 261
  • 我被黑心中介騙來(lái)泰國(guó)打工, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人坦报。 一個(gè)月前我還...
    沈念sama閱讀 45,618評(píng)論 2 355
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像狂鞋,于是被迫代替她去往敵國(guó)和親片择。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,916評(píng)論 2 344

推薦閱讀更多精彩內(nèi)容

  • 一.CSS描述 CSS全稱為“層疊樣式表(Cascading Style Sheets)”骚揍,它主要是用于定義HTM...
    snowy_sunny閱讀 1,045評(píng)論 0 4
  • 一 外部式css樣式 (也可稱為外聯(lián)式)就是把css代碼寫一個(gè)單獨(dú)的外部文件中字管,這個(gè)css樣式文件以“.css...
    KunMitnic閱讀 927評(píng)論 0 1
  • 認(rèn)識(shí)css CSS全稱為“層疊樣式表 (Cascading Style Sheets)”,它主要是用于定義HTML...
    三秒嗨閱讀 634評(píng)論 0 1
  • CSS基礎(chǔ) 本文包括CSS基礎(chǔ)知識(shí)選擇器(重要P挪弧3笆濉!)繼承抽活、特殊性硫戈、層疊、重要性CSS格式化排版單位和值盒模型浮動(dòng)...
    廖少少閱讀 3,061評(píng)論 0 40
  • 文:莠子 紀(jì)曉芙受了滅絕老尼致命一掌下硕,已然氣息微弱丁逝,命在旦夕。她身在偏遠(yuǎn)的蝴蝶谷梭姓,身邊沒(méi)有可靠的人可以托付后事霜幼,她...
    莠子閱讀 560評(píng)論 0 2