Q1:CSS屬性默認值干擾佈局。
A1：
初始化
/* Reset ================================================================================= */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody,tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: top;
}Q2:更改全部字體大小。
A2:
使用rem標記字體大小，font-size:1.0rem;
rem表示相對長度單位，相對於根元素(即html元素)font-size計算值的倍數。
常用方式
html {
font-size: 62.5%;
/*10 ÷ 16 × 100% = 62.5%*/
/*瀏覽器默認字體大小16px;62.5%正好10px,方便計算,比如1.2rem等於12px;*/
/*或者直接強制指定font-size: 10px;*/
}
body {
font-size: 1.4rem;
}
h1 {
font-size: 2.4rem;
}Q3:根據不同手機屏幕，字體大小按比例縮放。
A3:
html{font-size:16px;}//默認16px;
@media screen and (min-width:300px) and (max-width:320px){html{font-size:14px;}}//width在300~320px（包含）,根字體大小14px；
@media screen and (min-width:321px) and (max-width:375px){html{font-size:16px;}}//width在321~375px（包含）,根字體大小16px；
@media screen and (min-width:376px) and (max-width:415px){html{font-size:18px;}}//width在376~415px（包含）,根字體大小18px；Q4:去除<a></a>標籤中文字的默認變化。
A4:
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
a:active {
text-decoration: none;
}Q5:ul下li元素之間存在空隙。
A5：
li元素浮動。
Q6:不改變div式樣，讓下面的div上移。
A6:
上面div使用overflow:auto;下面div使用margin-top:-10px。
Q7：文字超出某個長度使用“...”代替。
A7:
固定標籤寬度，並設置CSS
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;
Q8:圖片在div左右居中顯示。
A8:
<img style="width:100%;margin:0px auto;">
注意，一般圖片都要設置寬度，不然會將屏幕撐開，可以左右滑動。
Q9：使用span顯示文字。
A9：
span是行內標籤，無法設置高和寬，只是將其中的文字包裹起來。
<span style="display:block;float:left;height:65px;line-height:65px;text-align:center;color:#426580;font-weight:bold;font-size:1.0rem">測試</span>
display:block;=》可設置寬高，margin，padding。
float:left;=》一行顯示多個block類型的span，或者直接display:inline-block。
height:65px;line-height:65px;=》將這兩個屬性設置爲相同的值可以使文字垂直居中。
text-align:center;=》文字水平居中。
Q10：可以顯示數字的圓圈。
A10:
設置寬度，並設置弧度爲寬度的50%；
<span style="display:inline-block;width:10px;border-radius:50%;>0</span>