VIP10-12月2日日作業(yè):CSS常見(jiàn)屬性

問(wèn)題一:塊級(jí)元素和行內(nèi)元素分別有哪些拄氯?動(dòng)手測(cè)試并列出4條以上的特性區(qū)別

  • 塊級(jí)元素和行內(nèi)元素分別由哪些?
    1它浅、塊級(jí)元素:div译柏;h1~h6;p姐霍;hrform鄙麦;ul;dl;ol黔衡;pre蚓聘;tableli;dd盟劫;dt夜牡;tr;td侣签;th
    2塘装、行內(nèi)元素:em;strong影所;span蹦肴;a;br猴娩;img阴幌;button;iput卷中;label矛双;select;textareacode蟆豫;script
  • 動(dòng)手測(cè)試并列出4條以上特性區(qū)別
    1.塊級(jí)元素可以包含文本议忽,塊級(jí),行內(nèi)元素十减,而行內(nèi)元素只能包含文本和行內(nèi)元素栈幸;
塊元素的寬度占據(jù)父容器整行,行元素占據(jù)本身.png

2.塊級(jí)元素單獨(dú)占據(jù)一整行帮辟,行內(nèi)元素占據(jù)的位置只有自身文本寬度的空間速址;

塊元素的width和height 可調(diào),而行元素的寬高不可調(diào)织阅,只決定于行元素的內(nèi)容.png

3.塊級(jí)元素可以設(shè)置寬高壳繁,行內(nèi)元素設(shè)置寬高無(wú)效;

塊元素能容納塊元素和行內(nèi)元素荔棉,而行元素只能容納文本和其他行內(nèi)元素.png

4.塊級(jí)元素的padding闹炉,margin值設(shè)置有效,行內(nèi)元素padding润樱,margin上下的值設(shè)置無(wú)效渣触,但左右有效;

4.png

問(wèn)題二:什么是 CSS 繼承? 哪些屬性能繼承壹若,哪些不能嗅钻?

  • 什么是CSS繼承皂冰?
    答:繼承就是子元素繼承了父元素的CSS樣式的屬性
  • 什么屬性能繼承?
    1.字體:family养篓,size秃流,weight,line-height
    2.文本:letter-spacing柳弄,word-spacing舶胀,text-align, text-indent
    3.列表:list-style-type
    4.顏色:color,ps:a標(biāo)簽不能繼承父元素的字體顏色碧注,原因是a標(biāo)簽自己有默認(rèn)字體顏色嚣伐,會(huì)覆蓋掉- 繼承自父元素的字體顏色;
  • 什么屬性不能被繼承萍丐?
    1.display
    2.float
    3.padding和margin
    4.背景相關(guān)轩端,比如顏色圖片等

問(wèn)題三:用 CSS 實(shí)現(xiàn)一個(gè)三角形

三角.png

問(wèn)題四:?jiǎn)涡形谋疽绯黾?code>...如何實(shí)現(xiàn)?

小圓點(diǎn).png

1、white-space:nomal;:設(shè)置文本不換行逝变;
2基茵、overflow:hidden;:設(shè)置文本溢出隱藏;
3骨田、text-overflow:ellipsis: 設(shè)置溢出部分顯示為"...”

問(wèn)題五:px, em, rem 有什么區(qū)別耿导?

  • px 像素的單位声怔,當(dāng)使用px來(lái)規(guī)定字體的大小時(shí)态贤,那么該字體的大小就是規(guī)定的大小,不會(huì)改變醋火。
  • em 相對(duì)于父元素字體大小的倍數(shù)悠汽。
  • rem 相對(duì)于根元素字體大小的倍數(shù)。

問(wèn)題六:解釋下面代碼的作用?為什么要加引號(hào)? 字體里的數(shù)字符號(hào)代表什么?

body{
  font: 12px/1.5 tahoma,arial,'Hiragino Sans GB','\5b8b\4f53',sans-serif;
}

這段代碼的作用是:

  • 代碼的作用:將body元素設(shè)置字體的大小是12px(Chrome瀏覽器最小字體為12px)芥驳,行高是字體大小的1.5倍柿冲,其中的字體待選為:tahoma字體,arial字體兆旬,Hiragino Sans GB字體假抄,'\5b8b\4f53',sans-serif字體這幾種丽猬,瀏覽器查找用戶的字體庫(kù)宿饱,如果有第一種就使用第一種,如果沒(méi)有查找第二種脚祟,以此類推谬以。
  • 添加引號(hào)的原因:加引號(hào)是因?yàn)樽煮w的名字中包含空格,避免瀏覽器解析時(shí)候把它解析成多個(gè)詞匯由桌。
  • 字體里的數(shù)字符號(hào)代表Unicode碼为黎,為了避免直接寫(xiě)中文的情況下編碼不匹配時(shí)會(huì)產(chǎn)生亂碼的情況邮丰,將字體名稱用Unicode來(lái)表示。'\5b8b\4f53'就代表宋體铭乾。

問(wèn)題七:實(shí)現(xiàn)如下效果:card

問(wèn)題八:實(shí)現(xiàn)如下頁(yè)面:頁(yè)面

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末剪廉,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子炕檩,更是在濱河造成了極大的恐慌妈经,老刑警劉巖,帶你破解...
    沈念sama閱讀 212,383評(píng)論 6 493
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件捧书,死亡現(xiàn)場(chǎng)離奇詭異吹泡,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)经瓷,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,522評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門(mén)爆哑,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人舆吮,你說(shuō)我怎么就攤上這事揭朝。” “怎么了色冀?”我有些...
    開(kāi)封第一講書(shū)人閱讀 157,852評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵潭袱,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我锋恬,道長(zhǎng)屯换,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,621評(píng)論 1 284
  • 正文 為了忘掉前任与学,我火速辦了婚禮彤悔,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘索守。我一直安慰自己晕窑,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,741評(píng)論 6 386
  • 文/花漫 我一把揭開(kāi)白布卵佛。 她就那樣靜靜地躺著杨赤,像睡著了一般。 火紅的嫁衣襯著肌膚如雪截汪。 梳的紋絲不亂的頭發(fā)上疾牲,一...
    開(kāi)封第一講書(shū)人閱讀 49,929評(píng)論 1 290
  • 那天,我揣著相機(jī)與錄音挫鸽,去河邊找鬼说敏。 笑死,一個(gè)胖子當(dāng)著我的面吹牛丢郊,可吹牛的內(nèi)容都是我干的盔沫。 我是一名探鬼主播医咨,決...
    沈念sama閱讀 39,076評(píng)論 3 410
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼架诞!你這毒婦竟也來(lái)了拟淮?” 一聲冷哼從身側(cè)響起,我...
    開(kāi)封第一講書(shū)人閱讀 37,803評(píng)論 0 268
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤谴忧,失蹤者是張志新(化名)和其女友劉穎很泊,沒(méi)想到半個(gè)月后,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體沾谓,經(jīng)...
    沈念sama閱讀 44,265評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡委造,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,582評(píng)論 2 327
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了均驶。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片昏兆。...
    茶點(diǎn)故事閱讀 38,716評(píng)論 1 341
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖妇穴,靈堂內(nèi)的尸體忽然破棺而出爬虱,到底是詐尸還是另有隱情,我是刑警寧澤腾它,帶...
    沈念sama閱讀 34,395評(píng)論 4 333
  • 正文 年R本政府宣布跑筝,位于F島的核電站,受9級(jí)特大地震影響瞒滴,放射性物質(zhì)發(fā)生泄漏曲梗。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 40,039評(píng)論 3 316
  • 文/蒙蒙 一逛腿、第九天 我趴在偏房一處隱蔽的房頂上張望稀并。 院中可真熱鬧,春花似錦单默、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,798評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至耕皮,卻和暖如春境蜕,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背凌停。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,027評(píng)論 1 266
  • 我被黑心中介騙來(lái)泰國(guó)打工粱年, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人罚拟。 一個(gè)月前我還...
    沈念sama閱讀 46,488評(píng)論 2 361
  • 正文 我出身青樓台诗,卻偏偏與公主長(zhǎng)得像完箩,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子拉队,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,612評(píng)論 2 350

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

  • 問(wèn)答題47 /72 常見(jiàn)瀏覽器兼容性問(wèn)題與解決方案弊知? 參考答案 (1)瀏覽器兼容問(wèn)題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 13,737評(píng)論 1 92
  • 1.塊級(jí)元素和行內(nèi)元素 塊級(jí)(block-level)元素;行內(nèi)(內(nèi)聯(lián)粱快、inline-level)元素秩彤。 塊元素的...
    饑人谷_小侯閱讀 1,991評(píng)論 1 4
  • 本文主要是起筆記的作用,內(nèi)容來(lái)自慕課網(wǎng). 認(rèn)識(shí)CSS樣式 CSS全稱為“層疊樣式表 (Cascading Styl...
    0o凍僵的企鵝o0閱讀 2,630評(píng)論 0 30
  • 1.CSS基本概念 1.1 CSS的定義 CSS(Cascading Style Sheets)層疊樣式表事哭,主要用...
    寥寥十一閱讀 1,825評(píng)論 0 6
  • 夜來(lái)偏做尋常夢(mèng)漫雷,天曉自生無(wú)限情。 遙想此身多少事鳍咱,已行世路萬(wàn)千程珊拼。 為誰(shuí)還得爭(zhēng)先進(jìn),對(duì)此無(wú)須落后名流炕。 本是當(dāng)時(shí)寂寥...
    雪窗_武立之閱讀 425評(píng)論 0 8