CSS常見樣式2

1. text-align: center的作用是什么犁嗅,作用在什么元素上饥追?能讓什么元素水平居中?

給父元素設(shè)置text-align: center屬性可以使元素中的文本行居中對齊簿姨,作用在塊級元素上(比如段落),可以使其中的文本曙博、圖片水平居中世落。

2. IE 盒模型和W3C盒模型有什么區(qū)別?

W3C標(biāo)準(zhǔn)中padding郎笆、border所占的空間不在width、height范圍內(nèi)监婶。
IE的盒模型width包括content尺寸+padding+border旅赢。

3. *{ box-sizing: border-box;}的作用是什么?

box-sizing 屬性允許您以特定的方式定義匹配某個區(qū)域的特定元素惑惶。
*{ box-sizing: border-box;}設(shè)置所有塊級元素煮盼,使其并排放置帶有指定寬度和高度的框,并把邊框和內(nèi)邊距放入框中集惋。

4. line-height: 2和line-height: 200%有什么區(qū)別?

設(shè)置數(shù)字孕似,此數(shù)字會與當(dāng)前的字體尺寸相乘來設(shè)置行間距。
設(shè)置百分比刮刑,會基于父元素字體尺寸的百分比設(shè)置行間距喉祭。

5. inline-block有什么特性?如何去除縫隙雷绢?高度不一樣的inline-block元素如何頂端對齊?

  • 既呈現(xiàn) inline 特性(不占據(jù)一整行泛烙,寬度由內(nèi)容寬度決定)
    又呈現(xiàn) block 特性 (可設(shè)置寬高,內(nèi)外邊距)
  • 去除縫隙:父元素的font-size設(shè)置為0翘紊,子元素的font-size設(shè)置為實際大小
  • 頂端對齊:給設(shè)置了inline-block的元素添加vertical-align: top

6. CSS sprites是什么?

CSS sprites在國內(nèi)很多人叫css精靈蔽氨,是一種網(wǎng)頁圖片應(yīng)用處理方式。它允許你將一個頁面涉及到的所有零星圖片都包含到一張大圖中去帆疟,這樣一來鹉究,當(dāng)訪問該頁面時,載入的圖片就不會像以前那樣一幅一幅地慢慢顯示出來了踪宠。CSS Sprites其實就是把網(wǎng)頁中一些背景圖片整合到一張圖片文件中自赔,再利用CSS的“background-image”,“background- repeat”柳琢,“background-position”的組合進行背景定位绍妨,background-position可以用數(shù)字精確的定位出背景圖片的位置润脸。

7. 讓一個元素"看不見"有幾種方式?有什么區(qū)別?

1.display:none
優(yōu)點:簡單暴力他去,不需要多余代碼毙驯。缺點:會將元素從文檔刪除。
2.text-indent設(shè)置為足夠大的負值
這個值設(shè)置太大灾测,如 -99999px 時爆价,又會造成瀏覽器的性能問題,而且有的高分辨率顯示器還是會顯示出來行施。
3.position:absolute;top:-999emleft:-999em通過絕對定位使其超出瀏覽器顯示界面允坚。
優(yōu)點:信手拈來魂那,隨意擺放蛾号,缺點:用法太死,不能隨意修改涯雅,比較死板
4.visibility:hidden
缺點:該屬性會繼承鲜结。而且用了該屬性屬性之后,元素在前端頁面是解析不出來的活逆,但是元素依然存在在哪里精刷,只不過我們?nèi)庋鄄豢梢姡栽匾廊粫绊懙讲季帧?br> 5.opacity:0把元素不透明度直接調(diào)節(jié)到了0,使其消失蔗候。
缺點:瀏覽器IE9以下的是不認opacity屬性的.

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末怒允,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子锈遥,更是在濱河造成了極大的恐慌纫事,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,509評論 6 504
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件所灸,死亡現(xiàn)場離奇詭異丽惶,居然都是意外死亡,警方通過查閱死者的電腦和手機爬立,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,806評論 3 394
  • 文/潘曉璐 我一進店門钾唬,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人侠驯,你說我怎么就攤上這事抡秆。” “怎么了吟策?”我有些...
    開封第一講書人閱讀 163,875評論 0 354
  • 文/不壞的土叔 我叫張陵儒士,是天一觀的道長。 經(jīng)常有香客問我踊挠,道長乍桂,這世上最難降的妖魔是什么冲杀? 我笑而不...
    開封第一講書人閱讀 58,441評論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮睹酌,結(jié)果婚禮上权谁,老公的妹妹穿的比我還像新娘。我一直安慰自己憋沿,他們只是感情好旺芽,可當(dāng)我...
    茶點故事閱讀 67,488評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著辐啄,像睡著了一般采章。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上壶辜,一...
    開封第一講書人閱讀 51,365評論 1 302
  • 那天悯舟,我揣著相機與錄音,去河邊找鬼砸民。 笑死抵怎,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的岭参。 我是一名探鬼主播反惕,決...
    沈念sama閱讀 40,190評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼演侯!你這毒婦竟也來了姿染?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,062評論 0 276
  • 序言:老撾萬榮一對情侶失蹤秒际,失蹤者是張志新(化名)和其女友劉穎悬赏,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體程癌,經(jīng)...
    沈念sama閱讀 45,500評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡舷嗡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,706評論 3 335
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了嵌莉。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片进萄。...
    茶點故事閱讀 39,834評論 1 347
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖锐峭,靈堂內(nèi)的尸體忽然破棺而出中鼠,到底是詐尸還是另有隱情,我是刑警寧澤沿癞,帶...
    沈念sama閱讀 35,559評論 5 345
  • 正文 年R本政府宣布援雇,位于F島的核電站,受9級特大地震影響椎扬,放射性物質(zhì)發(fā)生泄漏惫搏。R本人自食惡果不足惜具温,卻給世界環(huán)境...
    茶點故事閱讀 41,167評論 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望筐赔。 院中可真熱鬧铣猩,春花似錦、人聲如沸茴丰。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,779評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽贿肩。三九已至峦椰,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間汰规,已是汗流浹背汤功。 一陣腳步聲響...
    開封第一講書人閱讀 32,912評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留控轿,地道東北人冤竹。 一個月前我還...
    沈念sama閱讀 47,958評論 2 370
  • 正文 我出身青樓,卻偏偏與公主長得像茬射,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子冒签,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,779評論 2 354

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

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案在抛? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J的外補...
    _Yfling閱讀 13,751評論 1 92
  • text-align: center的作用是什么,作用在什么元素上萧恕?能讓什么元素水平居中 1刚梭、當(dāng)作用于塊級元素時,...
    我要認真學(xué)前端閱讀 630評論 0 1
  • 1.text-align: center的作用是什么票唆,作用在什么元素上朴读?能讓什么元素水平居中 答:作用是使行內(nèi)元素...
    饑人谷_牛牛閱讀 363評論 0 0
  • text-align text-align CSS 屬性定義行內(nèi)內(nèi)容,如何相對它的塊元素對齊走趋。并不控制快元素自己的...
    nianxiaoge閱讀 247評論 0 0
  • 1. text-align: center的作用是什么衅金,作用在什么元素上?能讓什么元素水平居中簿煌? text-ali...
    饑人谷_邵征鵬閱讀 262評論 0 0