CSS常見樣式2

1、text-align: center的作用是什么照筑,作用在什么元素上吹截?能讓什么元素水平居中


  • 水平居中的作用。
  • 用在行內(nèi)元素凝危。

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


  • IE盒模型:
    width= border + padding + 內(nèi)容寬度
    <div> width:100px; border:10px solid; padding:10px; </div>
    那面content的寬度就是:
    100px - border-left:10px; - padding-left:10px; - padding-right:10px; - border-right:10px;=60px。
  • W3C盒模型:
    width = 內(nèi)容寬度
    border蛾默、padding所占空間不包含在width和height的范圍內(nèi)懦铺。
    width設(shè)置為100px,content的寬度就是100px支鸡。

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


  • box-sizing:border-box:
    指定使用IE盒模型牧挣。
    使用IE盒模型也是有好處的急前,可以省去計算邊框、內(nèi)邊距的時間瀑构。

4裆针、ine-height: 2和line-height: 200%有什么區(qū)別?


  • line-height:2
    行高為本身字體的2倍。
  • line-height:200%
    行高為父元素文字大小的2倍

5检碗、inline-block有什么特性据块?如何去除縫隙?高度不一樣的inline-block元素如何頂端對齊?


  • inline-block的特性:
    呈現(xiàn)行內(nèi)元素的特性折剃,不占據(jù)一整行另假,寬度大小由內(nèi)容決定,同時又有塊級元素的特性怕犁,可設(shè)置寬高和內(nèi)外邊距边篮。
  • 如何去除縫隙:
    1己莺、第一種方法:
    先去除標簽之間的空格,父元素設(shè)置font-size:0;戈轿,行內(nèi)元素在設(shè)置字體大小凌受。
    2、第二種方法:
    <div> <span>饑人谷</span><span>饑人谷</span>
    3思杯、第三種方法:
    <div> <span>饑人谷<span>饑人谷</span>
    4胜蛉、第四種方法:
    `<div>
  • inline-block元素如何頂端對齊:
    行內(nèi)元素設(shè)置vertical-align:top;

6、CSS sprite 是什么?


CSS Sprites在國內(nèi)很多人叫css精靈是一種網(wǎng)頁圖片應(yīng)用處理方式色乾。它允許你將一個頁面涉及到的所有零星圖片都包含到一張大圖中去誊册,這樣一來,當訪問該頁面時暖璧,載入的圖片就不會像以前那樣一幅一幅地慢慢顯示出來了案怯。對于當前網(wǎng)絡(luò)流行的速度而言,不高于200KB的單張圖片的所需載入時間基本是差不多的澎办,所以無需顧忌這個問題嘲碱。加速的關(guān)鍵,不是降低重量局蚀,而是減少個數(shù)麦锯。傳統(tǒng)切圖講究精細,圖片規(guī)格越小越好至会,重量越小越好离咐,其實規(guī)格大小無所謂谱俭,計算機統(tǒng)一都按byte計算奉件。客戶端每顯示一張圖片都會向服務(wù)器發(fā)送請求昆著。所以县貌,圖片越多請求次數(shù)越多,造成延遲的可能性也就越大凑懂。

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


opacity:0接谨;整體透明度為零
visibility:hidden:和opacity類似
display:none摆碉;消失,不占用位置
background-color:rgba(0脓豪,0巷帝,0,0.2)扫夜;設(shè)置背景色透明

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末楞泼,一起剝皮案震驚了整個濱河市驰徊,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌堕阔,老刑警劉巖棍厂,帶你破解...
    沈念sama閱讀 219,270評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件躺苦,死亡現(xiàn)場離奇詭異锦援,居然都是意外死亡,警方通過查閱死者的電腦和手機迅栅,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,489評論 3 395
  • 文/潘曉璐 我一進店門时呀,熙熙樓的掌柜王于貴愁眉苦臉地迎上來例驹,“玉大人,你說我怎么就攤上這事退唠【樾猓” “怎么了?”我有些...
    開封第一講書人閱讀 165,630評論 0 356
  • 文/不壞的土叔 我叫張陵瞧预,是天一觀的道長屎债。 經(jīng)常有香客問我,道長垢油,這世上最難降的妖魔是什么盆驹? 我笑而不...
    開封第一講書人閱讀 58,906評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮滩愁,結(jié)果婚禮上躯喇,老公的妹妹穿的比我還像新娘。我一直安慰自己硝枉,他們只是感情好廉丽,可當我...
    茶點故事閱讀 67,928評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著妻味,像睡著了一般正压。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上责球,一...
    開封第一講書人閱讀 51,718評論 1 305
  • 那天焦履,我揣著相機與錄音,去河邊找鬼雏逾。 笑死嘉裤,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的栖博。 我是一名探鬼主播屑宠,決...
    沈念sama閱讀 40,442評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼笛匙!你這毒婦竟也來了侨把?” 一聲冷哼從身側(cè)響起犀变,我...
    開封第一講書人閱讀 39,345評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎秋柄,沒想到半個月后获枝,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,802評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡骇笔,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,984評論 3 337
  • 正文 我和宋清朗相戀三年省店,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片笨触。...
    茶點故事閱讀 40,117評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡懦傍,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出芦劣,到底是詐尸還是另有隱情粗俱,我是刑警寧澤,帶...
    沈念sama閱讀 35,810評論 5 346
  • 正文 年R本政府宣布虚吟,位于F島的核電站寸认,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏串慰。R本人自食惡果不足惜偏塞,卻給世界環(huán)境...
    茶點故事閱讀 41,462評論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望邦鲫。 院中可真熱鬧灸叼,春花似錦、人聲如沸庆捺。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,011評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽疼燥。三九已至沧卢,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間醉者,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,139評論 1 272
  • 我被黑心中介騙來泰國打工披诗, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留撬即,地道東北人。 一個月前我還...
    沈念sama閱讀 48,377評論 3 373
  • 正文 我出身青樓呈队,卻偏偏與公主長得像剥槐,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子宪摧,可洞房花燭夜當晚...
    茶點故事閱讀 45,060評論 2 355

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

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案粒竖? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽?zāi)J的外補...
    _Yfling閱讀 13,754評論 1 92
  • text-align: center的作用是什么颅崩,作用在什么元素上?能讓什么元素水平居中讓行內(nèi)元素水平居中蕊苗;作用在...
    Komolei閱讀 243評論 0 0
  • text-align: center的作用是什么沿后,作用在什么元素上?能讓什么元素水平居中 1朽砰、當作用于塊級元素時尖滚,...
    我要認真學(xué)前端閱讀 633評論 0 1
  • 問答 1.text-align: center的作用是什么,作用在什么元素上瞧柔?能讓什么元素水平居中 作用:設(shè)置內(nèi)部...
    饑人谷_js_chen閱讀 337評論 0 0
  • 1.text-align: center的作用是什么漆弄,作用在什么元素上?能讓什么元素水平居中造锅? text-alig...
    草鞋弟閱讀 262評論 0 0