001、浮動(dòng)不上去的原因
1、寬度不夠浮動(dòng)不上去
2、前一個(gè)元素不浮動(dòng)后一個(gè)元素加了浮動(dòng)你也浮動(dòng)不上去
3、都加了浮動(dòng)還是浮動(dòng)不上去！那么請(qǐng)你檢查你的類名有沒有寫錯(cuò)
002、圖片出不來的原因
1、沒有設(shè)置寬度和高度
2、如果你的盒子里面有內(nèi)容可以不設(shè)置寬度和高度，因?yàn)槭悄愕膬?nèi)容給你撐開的高度
3、路徑錯(cuò)誤，一般情況下來說如果路徑錯(cuò)誤了，按照正常來說會(huì)在console里面會(huì)報(bào)一個(gè)紅色的錯(cuò)誤
4、檢查你的類名 以及你的class及id是否寫的正確
003、為什么我的內(nèi)容不居中
1、一般情況下如果讓一個(gè)內(nèi)容區(qū)居中的話必須設(shè)置兩個(gè)條件 a:寬度必須設(shè)置 b、margin:0 auto;
2、一般情況下外圍盒子用id 內(nèi)容元素如果需要取名字的情況下統(tǒng)一用class來取名
004、樣式加不上去
1、請(qǐng)檢查你的link標(biāo)簽的書寫是否跟我下面的一模一樣
<link rel="stylesheet" type="text/css" href="路徑"/>
2、請(qǐng)檢查你的類名 和你的取得名字
3、如何實(shí)在加不上去了請(qǐng)您看一下你們的權(quán)重是否被覆蓋了
005、什么時(shí)候需要減掉padding
1、如果這個(gè)盒子設(shè)定寬度和高度的話那么padding就需要減掉
2、如果這個(gè)盒子沒有設(shè)定的話那么就不需要減掉
006html標(biāo)簽嵌套的一些坑
1、a標(biāo)簽
a標(biāo)簽不能嵌套，若a標(biāo)簽中嵌套了a標(biāo)簽，瀏覽器會(huì)自動(dòng)添加結(jié)束符號(hào)，故不能嵌套
例如:
<a href="#">首頁
<a href="#">千鋒</a>
</a>
瀏覽器解析：
<a href="#">首頁</a>
<a href="#">千鋒</a>
如果代碼結(jié)構(gòu)復(fù)雜，會(huì)導(dǎo)致html層級(jí)錯(cuò)亂
不能嵌套的還有： h不能直接套h標(biāo)簽 p標(biāo)簽是不可以套塊標(biāo)簽的
2、p標(biāo)簽
3、h標(biāo)簽
rel的作用
rel 屬性用于指定當(dāng)前文檔與被鏈接文檔的關(guān)系
1、!DOCTYPE html
聲明文檔類型
2、網(wǎng)頁的三大組成部分
結(jié)構(gòu)層 表現(xiàn)層 行為層
html css js
3、什么是html
超文本標(biāo)記語言 Hyper Text Markup Language
4、什么是xhtml
可擴(kuò)展的超文本標(biāo)記語言
5、文件名規(guī)范
小寫英文字母、數(shù)字、下劃線的組合， 其中不得包含漢字、空格和特殊字符； 必須以英文字母開頭
6、站點(diǎn)的作用
整合網(wǎng)站資源 規(guī)劃網(wǎng)站的內(nèi)容和代碼
7、html的注釋
8、html中的三種列表分別是哪幾個(gè)？基本語法怎么寫
無序列表
<ul>
<li></li>
...
</ul>
有序列表
<ol>
<li></li>
...
</ol>
擴(kuò)展：可以通過type來改變有序列表的序列號(hào)
自定義列表
<dl>
<dt></dt>
<dd></dd>
</dl>
8、alt與title的區(qū)別
title:提示信息的作用
alt：當(dāng)圖片不顯示的時(shí)候顯示的信息
9、如何設(shè)置單元格與單元格之間的距離
cellspacing="0"
10、如何設(shè)置單元格與內(nèi)容之間的距離
cellspadding="0"
11、設(shè)置單元格的幾個(gè)必要的條件
width:寬度
height：高度
border：邊框
12、單元格的行合并和列合并
rowspan:行合并
colspan：列合并
13、target打開頁面的兩種方式
target="_self" 本頁面打開另一個(gè)頁面
target="_blank" 新開一個(gè)頁面
14、input的type類型都有哪些？
type:
text文本輸入框
password密碼輸入框
button:空按鈕
submit:提交按鈕
reset：重置按鈕
radio:單選按鈕
checkbox:復(fù)選按鈕
15、如何禁止表單或者輸入框輸入
disabled
16、如何讓checkbox默認(rèn)為選中狀態(tài)
checked
17、post和get的區(qū)別
- get是從服務(wù)器上獲取數(shù)據(jù)，post是向服務(wù)器傳送數(shù)據(jù)。
- get是把參數(shù)數(shù)據(jù)隊(duì)列加到提交表單的action屬性所指的URL中，在URL中可以看到。post是通過HTTP post機(jī)制，用戶看不到這個(gè)過程 。
- get傳送的數(shù)據(jù)量較小，不能大于2KB。post傳送的數(shù)據(jù)量較大，一般被默認(rèn)為不受限制。
- get安全性非常低，post安全性較高。但是執(zhí)行效率卻比Post方法好
18、css的基本語法
選擇符{屬性:屬性值;屬性:屬性值;}
19、css的引入方式有哪幾種？優(yōu)先級(jí)如何分配？
1、外部引入 <link rel="stylesheet" type="text/css" href="這里面是路徑"
2、內(nèi)部引入
<style>
....css代碼
</style>
3、行間樣式
<div style="屬性:屬性值;屬性:屬性值;"></div>
優(yōu)先級(jí)：
遵循一個(gè)"近水樓臺(tái)先得月"的原則 行間的最大 外部和內(nèi)部的優(yōu)先級(jí)主要看書寫的先后順序
20、css的選擇符都有哪些？ 權(quán)重分別是多少？
id選擇符 class選擇符 標(biāo)簽選擇符 偽類選擇符 全局選擇符 群組選擇符 包含選擇符
權(quán)重：100 10 1 10 1 相加
21偽類選擇器的幾種狀態(tài)
:link-------默認(rèn)狀態(tài)
:visited--------已訪問的一個(gè)狀態(tài)
:hover------鼠標(biāo)滑過的一個(gè)狀態(tài)
:active-----鼠標(biāo)按下去的一個(gè)狀態(tài)
22、link和import導(dǎo)入外部樣式的區(qū)別
差別1：老祖宗的差別：link屬于XHTML標(biāo)簽，而@import完全是CSS提供的一種方式。 link標(biāo)簽除了可以加載CSS外，還可以做很多其它的事情，比如定義RSS，定義rel連接屬性等，@import就只能加載CSS。
差別2：加載順序的差別：當(dāng)一個(gè)頁面被加載的時(shí)候（就是被瀏覽者瀏覽的時(shí)候），link引用的CSS會(huì)同時(shí)被加載，而@import引用的CSS 會(huì)等到頁面全部被下載完再被加載。所以有時(shí)候?yàn)g覽@import加載CSS的頁面時(shí)開始會(huì)沒有樣式。
差別3：兼容性的差別。：@import是CSS2.1提出的，所以老的瀏覽器不支持，@import只在IE5以上的才能識(shí)別，而link標(biāo)簽無此問題。
差別4：使用dom控制樣式時(shí)的差別：當(dāng)使用javascript控制dom去改變樣式的時(shí)候，只能使用link標(biāo)簽，因?yàn)锧import不是dom可以控制的.
23、px em pt ppi個(gè)是什么意思？絕對(duì)大小關(guān)鍵字都有哪些
PPI是圖像分辨率的單位，圖像ppi值越高，畫面的細(xì)節(jié)就越豐富，因?yàn)閱挝幻娣e的像素?cái)?shù)量更多。PPI也叫圖像的采樣率（在圖像中，每英寸所包含的像素?cái)?shù)目）。
px是像素單位，em是相對(duì)單位，pt是絕對(duì)單位
xx-small =9px
large =19px
x-small =11px
x-large=23px
small=13px
xx-large =27px
medium=16px
24、字體的屬性都有哪些
font-size
font-style
font-family
font-weight
color
line-height
屬性值自己看課件
25、文本屬性都有哪些
text-transform
text-align
text-decoration
text-indent
letter-spacing
word-spacing
屬性值自己看課件
26、列表屬性有哪些
list-style-type
list-style-image
list-style-position
屬性值自己看課件
27、background-repeat的屬性值有哪些，意思是什么？
no-repeat:不平鋪
repeat：平鋪 (默認(rèn))
repeat-x：橫向平鋪
repeat-Y:豎向平鋪
28、實(shí)現(xiàn)文本三個(gè)點(diǎn)的幾個(gè)條件
text-overflow屬性僅是：當(dāng)文本溢出時(shí)是否顯示省略標(biāo)記，并不具備其它的樣式屬性定義，要實(shí)現(xiàn)溢出時(shí)產(chǎn)生省略號(hào)的效果還需定義：
1、容器寬度：width：value；（px、%，都可以）
2、強(qiáng)制文本在一行內(nèi)顯示:white-space：nowrap;
3、溢出內(nèi)容為隱藏：overflow：hidden；
4、溢出文本顯示省略號(hào)：text-overflow：ellipsis;
注：必須是單行文本才能設(shè)置本文溢出?。?！
IE6+；chrome1.0+；safari3.1+（firefox,opera暫不支持）
29、請(qǐng)你解釋一下jpg gif 與png之間的不同之處
jpg:有背景顏色，背景不能夠透明，不支持動(dòng)畫
png:沒有背景顏色，不支持動(dòng)畫
gif:有動(dòng)畫效果，支持背景透明
30、常見的內(nèi)聯(lián)元素和塊級(jí)元素都有哪些。
div -最常用的塊級(jí)元素
dl - 和dt-dd 搭配使用的塊級(jí)元素
form - 交互表單
h1 -h6- 大標(biāo)題
hr - 水平分隔線
ol – 有序列表
p - 段落
ul - 無序列表
內(nèi)聯(lián)元素
a –超鏈接（錨點(diǎn)）
br - 換行
i - 斜體
em - 強(qiáng)調(diào)
img - 圖片
input - 輸入框
span - 常用內(nèi)聯(lián)容器，定義文本內(nèi)區(qū)塊
strong - 粗體強(qiáng)調(diào)
select - 項(xiàng)目選擇
31、vertical-align的用法
三個(gè)條件：
1：必須給容器（父元素）加上text-align:center;
2:必須給當(dāng)前元素轉(zhuǎn)成行內(nèi)塊元素（display:inline-block;）再給當(dāng)前元素加上vertical-align:middle;
3：在當(dāng)前元素的后面（沒有回車）加上同級(jí)元素span;并對(duì)span進(jìn)行vertical-align:middle;width:0;height:100%;display:inline-block
32、請(qǐng)簡述一下塊級(jí)元素和內(nèi)聯(lián)元素的特點(diǎn)
塊級(jí)元素
a、塊狀元素在網(wǎng)頁中就是以塊的形式顯示，所謂塊狀就是元素顯示為矩形區(qū)域，
B:默認(rèn)情況下，塊狀元素都會(huì)占據(jù)一行，通俗地說，兩個(gè)相鄰塊狀元素不會(huì)出現(xiàn)并列顯示的現(xiàn)象；默認(rèn)情況下，塊狀元素會(huì)按順序自上而下排列。
C:塊狀元素都可以定義自己的寬度和高度。
D:塊狀元素一般都作為其他元素的容器，它可以容納其它內(nèi)聯(lián)元素和其它塊狀元素。我們可以把這種容器比喻為一個(gè)盒子。
內(nèi)聯(lián)元素三大特點(diǎn)：
A:內(nèi)聯(lián)元素的表現(xiàn)形式是始終以行內(nèi)逐個(gè)進(jìn)行顯示；
B:內(nèi)聯(lián)元素沒有自己的形狀，不能定義它的寬和高,它顯示的寬度、高度只能根據(jù)所包含內(nèi)容的高度和寬度來確定，它的最小內(nèi)容單元也會(huì)呈現(xiàn)矩形形狀；
C:內(nèi)聯(lián)元素也會(huì)遵循盒模型基本規(guī)則，如可以定義padding,border,margin,background等屬性，但個(gè)別屬性不能正確顯示;(padding-top:;margin-top/bottom:;)
32、什么是置換元素與非置換元素
置換元素：具有內(nèi)聯(lián)元素的特征，但是可以直接設(shè)置寬度和高度！常見的置換元素----img input select textarea
什么是非置換元素：除了置換元素其他都是非置換元素
33、position定位的屬性值都有哪些？每個(gè)值得意思是什么？
static：默認(rèn)值。位置設(shè)置為 static 的元素會(huì)正常顯示，它始終會(huì)處于文檔流給予的位置（static 元素會(huì)忽略任何 top、bottom、left 或 right 聲明）。
absolute：相對(duì)于父級(jí)元素的絕對(duì)定位，浮出、脫離布局流，它不占據(jù)空間，就是我們所說的層，其位置相對(duì)于最近的已定位父元素而言的位置，若父級(jí)都沒有定位，則以html（根元素）可直接指定 “l(fā)eft”、“top”、“right” 以及 “bottom” 屬性。。(層疊的順序z-index:value)
relative：是相對(duì)于默認(rèn)位置的偏移定位，通過設(shè)置left、top、right、bottom值可將其移至相對(duì)于其正常位置的地方（相對(duì)于自己的開始的位置發(fā)生的位置上的移動(dòng)，【不會(huì)破壞正常的布局流】
fixed：相對(duì)瀏覽器的絕對(duì)定位，是相對(duì)于瀏覽器窗口的指定坐標(biāo)進(jìn)行定位。此元素的位置可通過 "left"、"top"、"right" 以及"bottom" 屬性來規(guī)定。不論窗口滾動(dòng)與否，元素都會(huì)留在那個(gè)位置。
34、相對(duì)定位和絕對(duì)定位的區(qū)別
1、參照物不同，絕對(duì)定位的參照物是包含塊（已定位的父元素），相對(duì)定位的參照物是元素本身默認(rèn)的位置；
2、絕對(duì)定位將對(duì)象從文檔流中拖離出來因此不占據(jù)空間，相對(duì)定位不破壞正常的文檔流順序無論是否進(jìn)行移動(dòng)，元素仍然占據(jù)原來的空間。
35、哪種定位有z-index屬性
固定定位(fixed) 絕對(duì)定位（absolute）
36、如何讓一個(gè)元素消失（至少寫出5種方式）
1、display:none
2、height:0;
3、overflow:hidden;
4、position定位，然后控制left top right bottom 負(fù)值
5、margin負(fù)值
37、如果給一個(gè)元素設(shè)置透明度，如何讓這個(gè)元素的內(nèi)容不發(fā)生透明度變化
1、rgba()
2、定位脫離文檔流
38、如何讓一個(gè)物體在頁面水平垂直居中
1、div{width:200px;height:200px;background:#f00;position:fixed;left:0;right:0;top:0;bottom:0;margin:auto;}
2、div{width:200px;height:200px;background:#f00;position:fixed;left:50%;top:50%;margin:-100px 0 0 -100px;}
39、透明度的兼容寫法
透明度設(shè)置 IE10以下瀏覽器寫法：
filter:alpha(opacity=value);取值范圍 1-100 IE9兩種都支持，但是優(yōu)先顯示上面的方法；
兼容其他瀏覽器寫法： opacity: .value（0.2）
(value的取值范圍0-1,0.1,0.2,0.3-----0.9) 例如：opacity: .8 ; filter:alpha(opacity=80);
40、什么是精靈圖，它的原理是什么。優(yōu)點(diǎn)是什么 ？
一、將導(dǎo)航背景圖片、按鈕背景圖片等有規(guī)則的合并成一張背景圖，即將多張圖片合為一張整圖，然后用background-position”來實(shí)現(xiàn)背景圖片的定位技術(shù)。
二、圖片整合的優(yōu)勢(shì)： 1）通過圖片整合來減少對(duì)服務(wù)器的請(qǐng)求次數(shù)，從而提高 頁面的加載速度。 2）通過整合圖片來減小圖片的體積。
41、為對(duì)象選擇符有哪些
1、::after: 與content屬性一起使用，定義在對(duì)象后的內(nèi)容。
2、before:與content屬性一起使用,定義在對(duì)象前 的內(nèi)容。
3、::first-letter 定義對(duì)象內(nèi)第一個(gè)字符的樣式。
4、::first-line:定義對(duì)象內(nèi)第一行的樣式。
5、:selection:定義對(duì)象選中后高亮效果
42、清除浮動(dòng)的幾種方式，（至少寫4種）
hack1：給父元素添加聲明overflow:hidden;
- 優(yōu)點(diǎn)：簡單，代碼少，瀏覽器支持好
- 缺點(diǎn)：不能和position配合使用，因?yàn)槌龅某叽绲臅?huì)被隱藏
hack2: 給父元素加height
- 優(yōu)點(diǎn)：簡單，代碼少，容易掌握
- 缺點(diǎn)：只適合高度固定的布局，要給出精確的高度，如果高度和父級(jí)div不一樣時(shí)，會(huì)產(chǎn)生問題
hack3: 在浮動(dòng)元素下方添加空div,并給該元素添加 聲明：div{clear:both;}
優(yōu)點(diǎn) 代碼少 容易掌握
缺點(diǎn) 若浮動(dòng)過多，會(huì)導(dǎo)致代碼累贅
hack4:萬能清除浮動(dòng)法 p:after{content:“.”;clear:both;display:block;height:0;overflow:hidden; visibility:hidden;}
缺點(diǎn)：代碼多，不易理解，不適合初學(xué)者理解原理。
優(yōu)點(diǎn)：支持性好，各大網(wǎng)站都在用萬能清除浮動(dòng)
43、*visibility:hidden;和display:none;的區(qū)別：
visibility:hidden;屬性會(huì)使對(duì)象不可見，但該對(duì)象在網(wǎng)頁所占的空間沒有改變，等于留出了一塊空白區(qū)域，而 display:none屬性會(huì)使這個(gè)對(duì)象徹底消失不顯示，也不再占用位置。
44、什么是css樣式表？優(yōu)先級(jí)算法如何計(jì)算？
層疊樣式表。
a.重要性和來源的優(yōu)先級(jí)排序從低到高是：
1）瀏覽器默認(rèn)樣式
2）class/id.....選擇器的權(quán)重
3）內(nèi)部或者外部 （書寫順序）
4）行間樣式
5）!important 最高的
45、你所知道的IE過濾器都有哪些，兼容性如何
1）_ 下劃線屬性過濾器
IE6及更低版本瀏覽器中會(huì)繼續(xù)解析這個(gè)規(guī)則。
2）!important關(guān)鍵字過濾器 它表示所附加的聲明具有最高優(yōu)先級(jí)的意思。被瀏覽器優(yōu)先顯示。（IE6不識(shí)別此寫法） 語法：選擇符{屬性：屬性值!important;}
3）* 屬性過濾器 該屬性能被IE7及以下瀏覽器識(shí)別，
4）\9 ： IE版本識(shí)別；其他瀏覽器都不識(shí)別
5）\0 : IE8及以上版本識(shí)別；其他瀏覽器都不識(shí)別
46、如何讓一個(gè)物體在頁面水平垂直居中
1、div{width:200px;height:200px;background:#f00;position:fixed;left:0;right:0;top:0;bottom:0;margin:auto;}
2、div{width:200px;height:200px;background:#f00;position:fixed;left:50%;top:50%;margin:-100px 0 0 -100px;}
47、五大瀏覽器內(nèi)核代表作品
*Trident: IE、Maxthon(遨游)、騰訊 、Theworld世界之窗、360瀏覽器
代表作品IE
*Gecko：： 代表作品Mozilla Firefox
*Webkit : 代表作品Safari、Chrome
*Presto : 代表作品Opera ，
*Blink ：由Google和Opera Software開發(fā)的瀏覽器排版引擎，2013年4月發(fā)布。
48、哪些屬性可以繼承？
1）文字相關(guān)：font-family、font-size、font-style、font-variant、font-weight、font、letter-spacing、line-height、text-align、text-indent、text-transform、word-spacing
2）列表相關(guān)：list-style-image、list-style-position、list-style-type、list-style
3）顏色相關(guān)：color
4）透明度（子元素會(huì)繼承祖元素的opacity，但是無法更改）
注：font-size繼承的是父元素的大小，而不是比例。line-height當(dāng)父元素是百分比或px值得時(shí)候，子元素跟父元素相同，當(dāng)父元素是normal或數(shù)字的時(shí)候，子元素的line-height是子元素的字體大小乘以數(shù)字。
49、表格的行分組有哪些
<thead></thead>表頭
<tbody></tbody>表體
<tfoot></tfoot>表尾
50、表單字段集與字段級(jí)標(biāo)題的用法
舉個(gè)栗子
<fieldset disabled="disabled">
<legend>健康狀況</legend>
身高：<input type="text"/>
體重：<input type="text"/>
</fieldset>
51、請(qǐng)您簡述一下jpg,gif，png各自的特點(diǎn)和不同
1)jpg:有損壓縮格式，靠損失圖片本身的質(zhì)量來減小圖片的體積，適用于顏色豐富的圖像;(像素點(diǎn)組成的，像素點(diǎn)越多會(huì)越清晰 )
2）gif：有損壓縮格式，靠損失圖片的色彩數(shù)量來減小圖片的體積，支持透明，支持動(dòng)畫，適用于顏色數(shù)量較少的圖像;
3)png:有損壓縮格式，損失圖片的色彩數(shù)量來減小圖片的體積，支持透明，不支持動(dòng)畫，是fireworks的 源文件格式，適用于顏色數(shù)量較少的圖像;
52、 詳細(xì)說明BFC的渲染規(guī)則，怎樣生成新的BFC，及其作用？
什么是bfc:?
塊級(jí)格式化上下文，他是一個(gè)獨(dú)立的渲染區(qū)域，也可以理解成一個(gè)獨(dú)立的容器
如何產(chǎn)生BFC?
.根元素
b.float屬性不為none
c.position為absolute或fixed
d.display為inline-block，table-cell，table-caption，flex，inline-flex
e.overflow不為visible
bfc的作用？
a.自適應(yīng)兩欄布局
b.清除內(nèi)部浮動(dòng)
c.防止垂直margin重疊（放在兩個(gè)BFC里）
53、請(qǐng)寫出5種IE6兼容的問題，并寫出解決方法
詳情看兼容的筆記
54、 為什么要用css reset文件？
定義：首先css reset指的是重置瀏覽器的默認(rèn)樣式
作用：因?yàn)楝F(xiàn)在的瀏覽器很多，并且每個(gè)瀏覽器都有自己的默認(rèn)樣式，這樣就會(huì)導(dǎo)致一個(gè)頁面在多個(gè)瀏覽器下展示產(chǎn)生差異，所以我們需要做一些處理使每個(gè)瀏覽器下展示一致，故需要css reset
55、哪些元素的值可以設(shè)置成負(fù)值
z-index
text-indent
margin
position
order
陰影：text-shadow:
56、在css中如何合并單元格與單元格之間的距離、以及邊框線如何變成一像素、如何讓沒有內(nèi)容的元素消失
border-spacing:可以設(shè)置單元格與單元格之間的距離
border-collapse:collapse可以合并單元格的邊框線
empty-cells:hide 可以讓無內(nèi)容的元素消失
57、表單數(shù)據(jù)的行分組都有哪些
thead tbody tfoot
58、請(qǐng)寫出20個(gè)HTML5新增的標(biāo)簽？
header footer main section article aside figure caption <time>
colgroup col video audio nav legend fieldset datalist source
59、請(qǐng)寫出video和audio常用的一些屬性
controls屬性：如果出現(xiàn)該屬性，則向用戶顯示控件，比如播放按鈕。
autoplay屬性：如果出現(xiàn)該屬性，則視頻在就緒后馬上播放。
loop屬性：重復(fù)播放屬性。
muted屬性：靜音屬性。
poster屬性：規(guī)定視頻正在下載時(shí)顯示的圖像，直到用戶點(diǎn)擊播放按鈕。
Type屬性值： 用于視頻：video/ogg video/mp4 video/webm 用于音頻：audio/ogg audio/mpeg
60、如何設(shè)置文本框處于未輸入狀態(tài)時(shí)文本框中顯示的輸入提示
placeholder
61、如何給文本框、選擇框、自動(dòng)獲得焦點(diǎn)
autofocus="autofocus"
62、如何設(shè)置表單驗(yàn)證不能為空
required="required"
63、如何取消表單的驗(yàn)證？
novalidate="novalidate"
64、簡述一下你對(duì)HTML語義化的理解?
用正確的標(biāo)簽做正確的事情。
html語義化讓頁面的內(nèi)容結(jié)構(gòu)化，結(jié)構(gòu)更清晰，便于對(duì)瀏覽器、搜索引擎解析;
及時(shí)在沒有樣式CCS情況下也以一種文檔格式顯示，并且是容易閱讀的;
搜索引擎的爬蟲也依賴于HTML標(biāo)記來確定上下文和各個(gè)關(guān)鍵字的權(quán)重，利于SEO;
使閱讀源代碼的人對(duì)網(wǎng)站更容易將網(wǎng)站分塊，便于閱讀維護(hù)理解。
65、漸進(jìn)增強(qiáng)和優(yōu)雅降級(jí)
漸進(jìn)增強(qiáng) ：針對(duì)低版本瀏覽器進(jìn)行構(gòu)建頁面，保證最基本的功能，然后再針對(duì)高級(jí)瀏覽器進(jìn)行效果、交互等改進(jìn)和追加功能達(dá)到更好的用戶體驗(yàn)。
優(yōu)雅降級(jí) ：一開始就構(gòu)建完整的功能，然后再針對(duì)低版本瀏覽器進(jìn)行兼容
66、層級(jí)選擇器都哪有些
E+F E>F E~F
67、主流瀏覽器的前綴有哪些？
-ms- IE
-moz- 火狐
-webkit 谷歌
-o- Opera
68、background-size有哪幾個(gè)值？每個(gè)值的意思都是什么？
1、以百分比為值設(shè)置背景圖大小
2、cover
把背景圖像擴(kuò)展至足夠大，以使背景圖像完全覆蓋背景區(qū)域
3、contain
把圖像圖像擴(kuò)展至最大尺寸，以使其寬度和高度完全適應(yīng)內(nèi)容區(qū)域
69、video與audio常用的格式有哪些
用于視頻：video/ogg video/mp4 video/webm
用于音頻：audio/ogg audio/mpeg
70、.px，em，rem，pt 、ppi 的每個(gè)代表什么意思
）px實(shí)際上就是像素，用px設(shè)置字體大小時(shí)，比較穩(wěn)定和精確
但是這種方法存在一個(gè)問題，當(dāng)用戶在瀏覽器中瀏覽我們制作的web頁面時(shí)，如果對(duì)瀏覽器進(jìn)行了縮放，這時(shí)會(huì)使我們的web頁面布局被打破。因此，這時(shí)就提出了使用“em”來定義web頁面的字體。
2）em就是根據(jù)基準(zhǔn)來縮放字體的大小
em是相對(duì)于其父元素來設(shè)置字體大小的，這樣就會(huì)存在一個(gè)問題，進(jìn)行任何元素設(shè)置，都有可能需要知道他父元素的大小
3）rem是相對(duì)于根元素字體大小來顯示的
rem是相對(duì)于根元素<html>，這樣就意味著，我們只需要在根元素確定一個(gè)參考值
4）pt的大小等于1英寸的1/72
磅：他是作為文字的一種計(jì)量單位
這種度量方式來源于打印-設(shè)計(jì)背景，最適合于媒體，但同樣廣泛應(yīng)用于顯示器
PPI是圖像分辨率的單位，圖像ppi值越高，畫面的細(xì)節(jié)就越豐富，因?yàn)閱挝幻娣e的像素?cái)?shù)量更多。
71、css選擇符有哪些？
1）通配選擇符 *
2）類型選擇符 /元素選擇符 a
3）屬性選擇符 input[type="button"]
4）包含選擇符 div .code a
5）子對(duì)象選擇符 ul.test>li
6）ID選擇符 #
7）類選擇符 .
8）群組選擇符 body,ul,li
9）偽類及偽對(duì)象選擇符 div:first-letter a:hover
10）相鄰選擇符 li+li
72、請(qǐng)你說一下標(biāo)準(zhǔn)盒模型與怪異盒模型的一個(gè)區(qū)別？他們的組成部分是如何組成的
標(biāo)準(zhǔn)盒模型：content+border+padding
怪異盒模型：content
一個(gè)算盒子的寬度的時(shí)候加上border和padding另一個(gè)不加
怪異盒模型實(shí)現(xiàn)：box-sizing:border-box
標(biāo)準(zhǔn)盒模型：box-sizing:content-box
73、html+css經(jīng)典布局
1）左列定寬 右列自適應(yīng)----------------->懸掛式布局
2）兩列定寬 中間自適應(yīng)---------------->圣杯布局
74、彈性盒知識(shí)點(diǎn)
彈性盒
1、要使用彈性盒、必須要給父級(jí)加上display：flex
2、我們要設(shè)置主軸的排列方式：flex-direction;主軸的默認(rèn)排列方式是row(也就是沿X軸排列) 如果需要沿Y軸排列的話就設(shè)置值column
3、設(shè)置主軸的對(duì)其方式：如果主軸的排列方式是column那么現(xiàn)在的主軸就是Y軸 如果是row 那么主軸就是X；屬性：justify-content
4、設(shè)置側(cè)軸的對(duì)其方式：align-items;也就是說設(shè)置Y軸的對(duì)齊方式
5、align-content:用多行對(duì)齊方式的話就必須用flex-wrap值為wrap.這個(gè)也是來設(shè)置Y軸的對(duì)齊方式
6、flex-wrap是來設(shè)置換行主要用到的值就是wrap
7、flex:1 這個(gè)的意思就是說將剩余部分全部占用；假設(shè)header與footer各占88px（高度）那么main部分就占剩余頁面的全部空間
8、order：排列順序 跟z-index相似
9、align-self:這個(gè)是來控制某一個(gè)元素的對(duì)其方式
75、H5頁面窗口自動(dòng)調(diào)整到設(shè)備寬度，并禁止用戶縮放頁面
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
width = device-width：寬度等于當(dāng)前設(shè)備的寬度
initial-scale： 初始的縮放比例（默認(rèn)設(shè)置為1.0）
minimum-scale：允許用戶縮放到的最小比例（默認(rèn)設(shè)置為1.0）
maximum-scale：允許用戶縮放到的最大比例（默認(rèn)設(shè)置為1.0）
user-scalable：用戶是否可以手動(dòng)縮放（默認(rèn)設(shè)置為no，因?yàn)槲覀儾幌Ｍ脩舴糯罂s小頁面）
嚴(yán)格按照這種寫法來做
76、請(qǐng)你說一下標(biāo)準(zhǔn)盒模型與怪異盒模型的一個(gè)區(qū)別？他們的組成部分是如何組成的
標(biāo)準(zhǔn)盒模型：content+border+padding
怪異盒模型：content
一個(gè)算盒子的寬度的時(shí)候加上border和padding另一個(gè)不加
怪異盒模型實(shí)現(xiàn)：box-sizing:border-box
標(biāo)準(zhǔn)盒模型：box-sizing:content-box
77、html+css經(jīng)典布局
1）左列定寬 右列自適應(yīng)----------------->懸掛式布局
2）兩列定寬 中間自適應(yīng)---------------->圣杯布局
78、響應(yīng)式布局特點(diǎn)
設(shè)計(jì)特點(diǎn)：
面對(duì)不同分辨率設(shè)備靈活性強(qiáng)
能夠快捷解決多設(shè)備顯示適應(yīng)問題
缺點(diǎn)：
兼容各種設(shè)備工作量大，效率低下
代碼累贅，會(huì)出現(xiàn)隱藏?zé)o用的元素，加載時(shí)間加長
其實(shí)這是一種折中性質(zhì)的設(shè)計(jì)解決方案，多方面因素影響而達(dá)不到最佳效果
一定程度上改變了網(wǎng)站原有的布局結(jié)構(gòu)，會(huì)出現(xiàn)用戶混淆的情況
79、移動(dòng)端布局的方式有哪幾種
vw ：視窗寬度，1vw等于視窗寬度的1%。
rem：根據(jù)根元素字體的大小來設(shè)置元素的寬度和高度
80、rem布局的一個(gè)缺點(diǎn)
1）做出來的效果與效果圖有些許偏差。
2）雪碧圖定位問題
3）rem單位最好不用在PC端
81、請(qǐng)寫出幾種漸變的屬性
線性漸變：linear-gradient
徑向漸變：radial-gradient
重復(fù)性漸變：repeating-linear-gradient repeating-radial-gradient
82、請(qǐng)寫出2D中常用的屬性和屬性值，并寫出每個(gè)的意思
transform:translate-----------------位移
transform:rotate--------------------旋轉(zhuǎn)
transform:skew----------------------變形
transform:scale---------------------放大縮小
83、如何控制2D或3D中的變形原點(diǎn)
transform-origin
84、3D種景深效果的屬性及概念？
perspective:
-webkit-perspective:
近大遠(yuǎn)小
85、animation動(dòng)畫由哪幾部分組成？animation的簡寫每個(gè)值代表什么？
keyframes animation兩部分組成
animation:動(dòng)畫名稱 動(dòng)畫持續(xù)時(shí)間 動(dòng)畫類型 延遲時(shí)間 定義是否循環(huán) 動(dòng)畫運(yùn)動(dòng)方向
86、animation和transition的區(qū)別
相同點(diǎn)：都是隨著時(shí)間改變?cè)氐膶傩灾怠?/p>
不同點(diǎn)： transition需要觸發(fā)一個(gè)事件(hover事件或click事件等)才會(huì)隨時(shí)間改變其
css屬性； 而animation在不需要觸發(fā)任何事件的情況下也可以顯式的隨著時(shí)間變化來改變?cè)豤ss的屬性值，從而達(dá)到一種動(dòng)畫的效果，css3的animation就需要明確的動(dòng)畫屬性值。
87、backface-visibility的用法
