2016.9.10 HTML1

1.樣式有幾種引入方式? link和 @import有什么區(qū)別?

在HTML中惠窄,引入CSS的方法主要有行內(nèi)式谅辣、內(nèi)嵌式、導(dǎo)入式和鏈接式三種前翎。

  • 行內(nèi)式:即在標(biāo)記的style屬性中設(shè)定CSS樣式稚配,這種方式本質(zhì)上沒有體現(xiàn)出CSS的優(yōu)勢,因此不推薦使用例:
  • 嵌入式:嵌入式則將對頁面中各種元素的設(shè)置集中寫在<head>和</head>之間鱼填,對于單一的網(wǎng)頁药有,這種方法很方便。但是對于一個包含很多頁面的網(wǎng)站苹丸,如果每個頁面都以內(nèi)嵌方式設(shè)置各自的樣式愤惰,就失去了CSS帶來的巨大優(yōu)點,因此一個網(wǎng)站通常都是編寫一個獨立的CSS樣式表文件赘理,使用以下兩種方式中的一種宦言,引入HTML文檔中。
  • 導(dǎo)入式與鏈接式:導(dǎo)入式和鏈接式的目的都是將一個獨立的CSS文件引入HTML文件商模,二者有相應(yīng)的區(qū)別奠旺。事實上,二者最大的區(qū)別在于鏈接式使用HTML的標(biāo)記引入外部CSS文件施流,而使用導(dǎo)入式則是使用CSS的規(guī)則引入外部CSS文件响疚。因此它們的語法也不同。如果使用鏈接式瞪醋,需要使用如下語句引入外部CSS文件忿晕。
    如果使用鏈接式,需要使用如下語句引入外部CSS文件:
    <link href="mystyle.css" rel="stylesheet" type="text/css" />
    如果使用導(dǎo)入式银受,則需要使用如下語句践盼。
    <style type="text/css">@import"mystyle.css";</style>

特別注意鸦采!

采用這兩種方式后的顯示效果也略有區(qū)別。使用鏈接方式時咕幻,會在裝置頁面主體部分之前裝載CSS文件渔伯,這樣顯示出來的網(wǎng)頁從一開始就是帶有樣式的效果,而使用導(dǎo)入式時肄程,會在整個頁面裝載完成后再裝載CSS文件锣吼,對于有的瀏覽器來說,在一些情況下绷耍,如果網(wǎng)頁文件的體積比較大吐限,則會出現(xiàn)先顯示無樣式的頁面,閃爍一下之后再出現(xiàn)樣式設(shè)置后的效果褂始。從瀏覽者的感受來說诸典,這是使用導(dǎo)入式的一個缺陷。

link和 @import的區(qū)別

2.文件路徑

   ../main.css 崎苗、  ./main.css   狐粱、main.css   、/main.css

有什么區(qū)別胆数?

../main.css 要尋找的main.css文件在上級目錄中肌蜻。
./main.css 要尋找的main.css文件與本文件在同一級目錄
/main.css要尋找的main.css文件在根目錄中
main.css 這個

不會

3.console.log是做什么用的?

它是一個彪悍的日志記錄功能必尼,您可以從您自己的web頁面上調(diào)用蒋搜,然后以最快的方式轉(zhuǎn)儲盡可能多的信息到控制臺上,從而能更醒目地讓你意識到你的javascript下一步需要做什么判莉。

  • console 控制臺
  • log 日志
    意思是在控制臺輸出日志信息豆挽。

4.text-align有幾個值,分別有什么作用券盅?寫截圖說明區(qū)別

描述
left 把文本排列到左邊帮哈。默認(rèn)值:由瀏覽器決定。
right 把文本排列到右邊锰镀。
center 把文本排列到中間娘侍。
justify 實現(xiàn)兩端對齊文本效果。
inherit 規(guī)定應(yīng)該從父元素繼承 text-align 屬性的值泳炉。
text-align.png

5.px憾筏、em、rem分別是什么花鹅?有什么區(qū)別氧腰?如何使用?

  • px像素(Pixel)。相對長度單位容贝。像素px是相對于顯示器屏幕分辨率而言的。
  • em是相對長度單位之景。相對于當(dāng)前對象內(nèi)文本的字體尺寸斤富。如當(dāng)前對行內(nèi)文本的字體尺寸未被人為設(shè)置,則相對于瀏覽器的默認(rèn)字體尺寸锻狗。
  • rem是CSS3新增的一個相對單位rem為元素設(shè)定字體大小時满力,仍然是相對大小,但相對的只是HTML根元素轻纪。這個單位可謂集相對大小和絕對大小的優(yōu)點于一身油额,通過它既可以做到只修改根元素就成比例地調(diào)整所有字體大小,又可以避免字體大小逐層復(fù)合的連鎖反應(yīng)刻帚。
    一般在body中聲明Font-size=62.5%潦嘶,這就使em值變?yōu)?16px*62.5%=10px, 這樣12px=1.2em, 10px=1em , 也就是說只需要將你的原來的px數(shù)值除以10,然后換上em作為單位就行了崇众。

10px=1em=1rem

5.2.png

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

chrome開發(fā)者工具簡介

chrome.gif
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末掂僵,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子顷歌,更是在濱河造成了極大的恐慌锰蓬,老刑警劉巖,帶你破解...
    沈念sama閱讀 222,378評論 6 516
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件眯漩,死亡現(xiàn)場離奇詭異芹扭,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)赦抖,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,970評論 3 399
  • 文/潘曉璐 我一進(jìn)店門舱卡,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人摹芙,你說我怎么就攤上這事灼狰。” “怎么了浮禾?”我有些...
    開封第一講書人閱讀 168,983評論 0 362
  • 文/不壞的土叔 我叫張陵交胚,是天一觀的道長。 經(jīng)常有香客問我盈电,道長蝴簇,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,938評論 1 299
  • 正文 為了忘掉前任匆帚,我火速辦了婚禮熬词,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己互拾,他們只是感情好歪今,可當(dāng)我...
    茶點故事閱讀 68,955評論 6 398
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著颜矿,像睡著了一般寄猩。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上骑疆,一...
    開封第一講書人閱讀 52,549評論 1 312
  • 那天田篇,我揣著相機(jī)與錄音,去河邊找鬼箍铭。 笑死泊柬,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的诈火。 我是一名探鬼主播兽赁,決...
    沈念sama閱讀 41,063評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼柄瑰!你這毒婦竟也來了闸氮?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,991評論 0 277
  • 序言:老撾萬榮一對情侶失蹤教沾,失蹤者是張志新(化名)和其女友劉穎蒲跨,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體授翻,經(jīng)...
    沈念sama閱讀 46,522評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡或悲,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,604評論 3 342
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了堪唐。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片巡语。...
    茶點故事閱讀 40,742評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖淮菠,靈堂內(nèi)的尸體忽然破棺而出男公,到底是詐尸還是另有隱情,我是刑警寧澤合陵,帶...
    沈念sama閱讀 36,413評論 5 351
  • 正文 年R本政府宣布枢赔,位于F島的核電站,受9級特大地震影響拥知,放射性物質(zhì)發(fā)生泄漏踏拜。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 42,094評論 3 335
  • 文/蒙蒙 一低剔、第九天 我趴在偏房一處隱蔽的房頂上張望速梗。 院中可真熱鬧肮塞,春花似錦、人聲如沸姻锁。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,572評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽位隶。三九已至烁设,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間钓试,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,671評論 1 274
  • 我被黑心中介騙來泰國打工副瀑, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留弓熏,地道東北人。 一個月前我還...
    沈念sama閱讀 49,159評論 3 378
  • 正文 我出身青樓糠睡,卻偏偏與公主長得像挽鞠,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子狈孔,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,747評論 2 361

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

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案信认? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補...
    _Yfling閱讀 13,760評論 1 92
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,317評論 25 707
  • 坦白說,教學(xué)沒有任何成就感均抽,班級聽的人也就幾個了嫁赏,剩下的就是為了賺3900活著了,還沒上交生活費油挥,也就這么回事了嗎...
    從心出發(fā)_d7c6閱讀 285評論 0 0
  • 我有一位女朋友潦蝇,她集單純深刻孤傲憂郁自主于一身。我深深愛著她深寥。在我不斷向她表示我對她的感情時攘乒,總感到她很回避。漸漸...
    熊玲心理咨詢閱讀 793評論 1 0
  • PDD作為一名知名的LOL大主播返十,無論是粉絲還是接觸過他的行業(yè)人士妥泉,都說他是一位很不錯的人。然而洞坑,自從他和LOL小...
    LOL小雪琪閱讀 501評論 3 0