騰訊WEB前端筆試題和面試題答案(二)

四、用心想一想，你一定是生活中的智者! (每題9分，共36分)

　　1. 寫出ul、ol、dl三種列表的html結構。

　　答：

　　復制代碼

　　2. 將以下CSS代碼進行縮寫，注意要符合縮寫的規范。

　　a) 代碼一：

　　border-width:1px;

　　border-color:#000;

　　border-style:solid;

　　復制代碼

　　b) 代碼二：

　　background-position:0 0;

　　background-repeat:no-repeat;

　　background-attachment:fixed;

　　background-color:#f00;

　　background-image:url(background.gif);

　　復制代碼

　　c)代碼三：

　　font-style:italic;

　　font-family:”Lucida Grande”,sans-serif;

　　font-size:1em;

　　font-weight:bold;

　　font-variant:small-caps;

　　line-height:140%;

　　復制代碼

　　d) 代碼四：

　　list-style-position:inside;

　　list-style-type:square;

　　list-style-image:url(image.gif);

　　復制代碼

　　e)代碼五：

　　margin-left:20px;

　　margin-right:20px;

　　margin-bottom:5px;

　　margin-top:20px;

　　復制代碼

　　f)代碼六：

　　color:#336699;

　　color:#ffcc00;

　　復制代碼

　　答：

　　代碼一：border:1px #000 solid;

　　代碼二：background: #f00 url(background.gif) no-repeat fixed 0 0;

　　代碼三：font:italic bold small-caps 1em/140% “lucida Grande”,sans-serif;

　　代碼四：list-style: url(image.gif) square inside;

　　代碼五：margin:20px 20px 5px 20px;

　　代碼六：color:#369;color:#fc0;

　　復制代碼

　　3. 修改以下代碼，使其結構更加合理以及符合W3C標準。(XHTML 1.0 Strict)

　　代碼：

　　Don’t buy these electronics used

　　Money may be tight, but you may kick

　　yourself for purchasing these electronics secondhand.

　　Even when the price is low,

　　the risk may be too high.

　　target=”_blank”>home content

　　復制代碼

　　答：

　　Don’t buy these electronics used

　　Money may be tight, but you may

　　kick yourself for purchasing these electronics secondhand.

　　Even when the price is

　　low, the risk may be too high.

　　target=_blank href=”home.html” rel=”external” title=”home”>home

　　rel=”external” title=”content”>content

　　復制代碼

　　4. 簡述border:none以及border:0的區別，并給出使用建議。

　　答：border:none表示邊框樣式無,border:0表示邊框寬度為0;當定義了border:none,即隱藏了邊框的顯

　　示,實際就是邊框寬度為0.

　　當定義邊框時,必須定義邊框的顯示樣式.因為邊框默認樣式為不顯示none,所以僅設置邊框寬度,由于樣

　　式不存在,邊框的寬度也自動被設置為0.

五、勇氣拼一拼，讓你超越別人的加分題目來了! (不限于一種方法，共30分)

　　使用重構的方式制作出一個如下圖的水、垂直都居中短邊為50px，長邊為150px的紅色十字架。