HTML2:html基礎(chǔ)和css樣式基礎(chǔ)

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

css有三種引入方式:

1.外部樣式表<link rel="stylesheet" type="text/css" href="文件名.css(例如main.css)">

2.內(nèi)部樣式表(位于標(biāo)簽內(nèi)部)

<style type="text/css">

? ? p{

? ? ? ? color:red;

? ? }

</style>

3.內(nèi)聯(lián)樣式(在HTML元素內(nèi)部)

<p style="color:blue; font-size:14px;">段落</p>

js有2種方式:

1.外部js

<script type="text/javascript" src="文件名.js"(例如main.js)></script>

2.內(nèi)部js

<script>

? ? console.log(hello);

</script>

其他方法

1.@import url(文件名.css(例如main.css))

2.瀏覽器缺省設(shè)置:在不設(shè)置樣式的情況下,瀏覽器使用默認(rèn)的樣式設(shè)置,例如:<h(1~6)>,<p>標(biāo)簽等;

ps:相對于內(nèi)部樣式表和內(nèi)聯(lián)樣式,外部樣式表更常用,因為在做網(wǎng)頁時,不會只寫一篇程序,如果css和js在HTML里同時出現(xiàn),會顯得很亂,重要的是不方便后期修改和維護(hù)。

link和@import都用于外部引用,link引用css時,頁面會在加載的同時加載css,@import引用css時,頁面會在加載完之后加載,造成頁面一開始沒有樣式。

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

../main.css:在上一級目錄文件中尋找該文件

./main.css:在當(dāng)前目錄文件中尋找該文件

main.css:在當(dāng)前目錄文件中尋找該文件

3.console.log是做什么用的

用于調(diào)試JavaScript,不會像alert一樣每次都會有彈窗,并且不能顯示字符串,console.log會在控制臺輸出信息,不會影響頁面運(yùn)行。

4.text-align有幾個值,分別有什么作用

1.text-align:center是文本居中顯示

2.text-align:left是文本往左邊對其

3.text-align:right是文本往右邊對其

4.text-align:justify是文字有多行的時候,讓文字左右兩邊對其

ps:如果對div設(shè)置text-align,就是對div的所有內(nèi)容設(shè)置了text-align

5.px、em、rem分別是什么?有什么區(qū)別?如何使用

PX:像素單位,幾PX就是幾像素

em:倍數(shù),相對于父元素的倍數(shù)

rem:倍數(shù),相對于根元素的倍數(shù)

PX是固定的,幾PX就是幾像素,不會隨著其他改變而改變,(chrome設(shè)置字體大小默認(rèn)最小12px,即使設(shè)置了更小的字號,也是顯示12px大小的字)使用:font-size:12px;border:1px;

em是相對于父元素字體的倍數(shù),1em是父元素字體的1倍,2em是父元素字體的2倍

rem是相對于根元素字體的倍數(shù),1em是根元素字體的1倍,2em是根元素字體的2倍

rem是對于根元素的固定元素,無論其他元素如何變化,它只遵循根元素的字體變化,em是不固定元素,它隨父元素的變化而變化。

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


Chrome提供了審查元素功能,只需右鍵點(diǎn)擊"審查元素"(名字),即可打開Chrome Inspector,獲得網(wǎng)頁各種元素的加載時間、Javascript函數(shù)、Object等信息。

審查元素可以在頁面內(nèi)查看該頁面任何元素的HTML、CSS和JavaScript信息,再想查看元素的位置點(diǎn)擊右鍵點(diǎn)擊檢查,可以看見所有信息,以及修改和添加信息,并且能夠以alert和console.log的方式檢查代碼顯示情況。

7.如下代碼,設(shè)置p為幾 rem,讓h1和p的字體大小相等?

應(yīng)該設(shè)置為6rem。

瀏覽器默認(rèn)字體大小是16px,16px*62.5%是10px,根節(jié)點(diǎn)字體大小是10px。h1的字體大小60px,是10px的6倍,p要和h1大小相等,需要設(shè)置為6rem

本文章版權(quán)屬 饑人谷_張世鈞和饑人谷 所有,如需轉(zhuǎn)載請務(wù)必注明出處。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 14,168評論 1 92
  • 本文主要是起筆記的作用,內(nèi)容來自慕課網(wǎng). 認(rèn)識CSS樣式 CSS全稱為“層疊樣式表 (Cascading Styl...
    0o凍僵的企鵝o0閱讀 2,750評論 0 30
  • CSS基礎(chǔ) 本文包括CSS基礎(chǔ)知識選擇器(重要!?。。├^承、特殊性、層疊、重要性CSS格式化排版單位和值盒模型浮動...
    廖少少閱讀 3,452評論 0 40
  • 美麗的森林里正在舉行比美大會呢!瞧!那美麗的金絲鳥,正穿著金燦燦的披風(fēng)向大家驕傲地炫耀著。 孔雀也不甘落后,把那像...
    senny1978閱讀 148評論 0 2
  • 所有的過去都已過去,不留痕跡,不曾相識,不曾相記,不見未來。 世界本來就很多想不明白的。 記錄一下。
    風(fēng)一樣的陽光橙閱讀 114評論 0 0

友情鏈接更多精彩內(nèi)容