html基礎(chǔ)

樣式有幾種引用方式旦事?link和<span color="red">@import</span>有什么區(qū)別宪肖?

樣式引入方式有三種:

1.外部引入樣式如<link rel="stylesheet" href="styles/style.css">
》中2.內(nèi)部樣式表樣式如<styletype="test/css" > body,p,h2 {margin: 0px;padding: 0px;}</style>
∥3.內(nèi)聯(lián)樣式如<p style="color:red;font-size:14px">字體紅色,字大14px</p>
link與@import二者都是引入外部文件,他們的區(qū)別是:
  1:link是XHTML標(biāo)簽甥捺,除了加載CSS外邮绿,還可以定義RSS等其他事務(wù)渠旁;@import屬于CSS范疇,只能加載CSS船逮。
 2:link引用CSS時一死,在頁面載入時同時加載;@import需要頁面網(wǎng)頁完全載入以后加載傻唾。
 3:link是XHTML標(biāo)簽投慈,無兼容問題;@import是在CSS2.1提出的冠骄,低版本的瀏覽器不支持伪煤。
 4:ink支持使用Javascript控制DOM去改變樣式;而@import不支持凛辣。

文件路徑../main.css 抱既、./main.css、main.css有什么區(qū)別?

  • ../main.css:意思是轉(zhuǎn)到上一級目錄扁誓,然后找到main.css文件防泵;
  • ./main.css:意思是在當(dāng)前目錄中找到main.css文件:
  • main.css與./main.css效果一樣,只是加“.”顯得更規(guī)范一點蝗敢。

console.log是做什么用的?

它是一個擁有輸出記錄功能的命令捷泞,可以從你自己的web頁面上調(diào)用,然后以最快的方式轉(zhuǎn)儲盡可能多的信息到控制臺上寿谴,從而能更醒目地讓你意識到你的javascript下一步需要做什么锁右。
&nbsp;console.log提供的功能遠(yuǎn)不止這些讶泰,還可以在它的控制臺中做更多的事咏瑟。如果給log傳遞的是一個對象或者數(shù)組、HTML元素等痪署,控制臺將會顯示為一個超鏈接码泞,點擊它就可以查看該元素的詳細(xì)信息了。相較于“alert”狼犯,console可以更為直觀余寥,更為簡潔的展示比較詳細(xì)的信息领铐。

text-align: justify是什么?

&nbsp劈狐;text-align是描述文本對齊方式的一個屬性罐孝,常見的值有l(wèi)eft呐馆、right肥缔、center。

  • 值 justify 可以使文本的兩端都對齊汹来。在兩端對齊文本中续膳,文本行的左右兩端都放在父元素的內(nèi)邊界上。然后收班,調(diào)整單詞和字母間的間隔坟岔,使各行的長度恰好相等。簡單一點的說摔桦,就是強行兩端對齊(多行文字)社付,行中字與字間距會適當(dāng)調(diào)整。

px邻耕、em鸥咖、rem分別是什么?有什么區(qū)別兄世?如何使用

  • px:像素(Pixel),相對長度單位啼辣。像素px是相對于顯示器屏幕分辨率而言的。因此御滩,相對與一臺機器鸥拧,px就是一個絕對的單位,設(shè)定了多少就是多少削解。
  • em:em是相對長度單位富弦。相對于當(dāng)前對象內(nèi)文本的字體尺寸。如當(dāng)前對行內(nèi)文本的字體尺寸未被人為設(shè)置氛驮,則相對于瀏覽器的默認(rèn)字體尺寸舆声。任意瀏覽器的默認(rèn)字體高都是16px。所有未經(jīng)調(diào)整的瀏覽器都符合: 1em=16px柳爽。那么12px=0.75em,10px=0.625em媳握。為了簡化font-size的換算,需要在css中的body選擇器中聲明Font-size=62.5%磷脯,這就使em值變?yōu)?16px*62.5%=10px, 這樣12px=1.2em, 10px=1em, 也就是說只需要將你的原來的px數(shù)值除以10蛾找,然后換上em作為單位就行了颅崩。

注意:em的值不是固定的剃根,只有在父級沒有設(shè)定大小的時候才跟著瀏覽器默認(rèn)字號走,如果父級設(shè)定了大小途乃,它會在父級的基礎(chǔ)上添加相應(yīng)的倍數(shù)(1em=1倍,1.5em=1.5倍)幻枉,因此碰声,如果父級元素設(shè)定大小后,子級假如設(shè)定為1.2em(即父級的1.2倍)熬甫,如果它的子級再設(shè)置1.2em胰挑,就會變?yōu)?.21.2=1.44em。這是一個相對的關(guān)系椿肩。*

  • rem:針對跟節(jié)點(HTML)進行倍數(shù)的升降瞻颂,這個單位可謂集相對大小和絕對大小的優(yōu)點于一身,通過它既可以做到只修改根元素就成比例地調(diào)整所有字體大小郑象,又可以避免字體大小逐層復(fù)合的連鎖反應(yīng)贡这。

對chrome 審查元素的功能做個簡單的截圖介紹

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市厂榛,隨后出現(xiàn)的幾起案子盖矫,更是在濱河造成了極大的恐慌,老刑警劉巖击奶,帶你破解...
    沈念sama閱讀 216,496評論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件辈双,死亡現(xiàn)場離奇詭異,居然都是意外死亡正歼,警方通過查閱死者的電腦和手機辐马,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,407評論 3 392
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來局义,“玉大人喜爷,你說我怎么就攤上這事√汛剑” “怎么了檩帐?”我有些...
    開封第一講書人閱讀 162,632評論 0 353
  • 文/不壞的土叔 我叫張陵,是天一觀的道長另萤。 經(jīng)常有香客問我湃密,道長,這世上最難降的妖魔是什么四敞? 我笑而不...
    開封第一講書人閱讀 58,180評論 1 292
  • 正文 為了忘掉前任泛源,我火速辦了婚禮,結(jié)果婚禮上忿危,老公的妹妹穿的比我還像新娘达箍。我一直安慰自己,他們只是感情好铺厨,可當(dāng)我...
    茶點故事閱讀 67,198評論 6 388
  • 文/花漫 我一把揭開白布缎玫。 她就那樣靜靜地躺著硬纤,像睡著了一般。 火紅的嫁衣襯著肌膚如雪赃磨。 梳的紋絲不亂的頭發(fā)上筝家,一...
    開封第一講書人閱讀 51,165評論 1 299
  • 那天,我揣著相機與錄音邻辉,去河邊找鬼溪王。 笑死,一個胖子當(dāng)著我的面吹牛恩沛,可吹牛的內(nèi)容都是我干的在扰。 我是一名探鬼主播缕减,決...
    沈念sama閱讀 40,052評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼雷客,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了桥狡?” 一聲冷哼從身側(cè)響起搅裙,我...
    開封第一講書人閱讀 38,910評論 0 274
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎裹芝,沒想到半個月后部逮,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,324評論 1 310
  • 正文 獨居荒郊野嶺守林人離奇死亡嫂易,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,542評論 2 332
  • 正文 我和宋清朗相戀三年兄朋,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片怜械。...
    茶點故事閱讀 39,711評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡颅和,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出缕允,到底是詐尸還是另有隱情峡扩,我是刑警寧澤,帶...
    沈念sama閱讀 35,424評論 5 343
  • 正文 年R本政府宣布障本,位于F島的核電站教届,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏驾霜。R本人自食惡果不足惜案训,卻給世界環(huán)境...
    茶點故事閱讀 41,017評論 3 326
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望粪糙。 院中可真熱鬧强霎,春花似錦、人聲如沸猜旬。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,668評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至椿争,卻和暖如春怕膛,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背秦踪。 一陣腳步聲響...
    開封第一講書人閱讀 32,823評論 1 269
  • 我被黑心中介騙來泰國打工褐捻, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人椅邓。 一個月前我還...
    沈念sama閱讀 47,722評論 2 368
  • 正文 我出身青樓柠逞,卻偏偏與公主長得像,于是被迫代替她去往敵國和親景馁。 傳聞我的和親對象是個殘疾皇子板壮,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,611評論 2 353

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

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補...
    _Yfling閱讀 13,748評論 1 92
  • 轉(zhuǎn)載請聲明 原文鏈接地址 關(guān)注公眾號獲取更多資訊 第一部分 HTML 第一章 職業(yè)規(guī)劃和前景 職業(yè)方向規(guī)劃定位...
    程序員poetry閱讀 16,551評論 32 459
  • 課程目標(biāo) 掌握樣式的幾種引入方式能使用Chrome開發(fā)工具進行基本頁面調(diào)試熟悉常見文本樣式熟悉單位的使用 課程建議...
    饑人谷_江君閱讀 456評論 0 0
  • ?前端面試題匯總 一合住、HTML和CSS 21 你做的頁面在哪些流覽器測試過绰精?這些瀏覽器的內(nèi)核分別是什么? ...
    Simon_s閱讀 2,220評論 0 8
  • 小時候很期待過年,每到過年就意味著有新衣服穿透葛,有平常吃不到的好吃的笨使。最開心的就是大年三十這天,除了吃完晚飯可以放煙...
    元寶Stella閱讀 757評論 0 0