你真的了解HTML嗎?
有這么一段HTML,請?zhí)裘。?/P>
<P> 哥寫的不是HTML,是寂寞。<br><br> 我說:<br>不要迷戀哥,哥只是一個(gè)傳說
這是原來雅虎一道筆試題(文字變了變),用了很多年了,還沒有一個(gè)人完全答對過。
============== 解答部分 ================
出這道題的動(dòng)機(jī)是,太多人覺得HTML太簡單,但它恰恰又是前端開發(fā)中最基礎(chǔ)最重要的部分。HTML結(jié)構(gòu)設(shè)計(jì)的合不合理,直接影響到代碼易不易維護(hù),靈不靈活,同時(shí)事關(guān)網(wǎng)頁性能,協(xié)作效率。碰到不少人認(rèn)為前端開發(fā)就是javascript開發(fā),大錯(cuò)特錯(cuò)啊。javascript, html, css這三個(gè)前端開發(fā)的基礎(chǔ)支柱,性質(zhì)完全不同又緊密關(guān)聯(lián),對它們的正確理解,合理應(yīng)用是專業(yè)與非專業(yè)的區(qū)別。有些后端工程師可以寫出很漂亮的JS,但他們真的不懂怎么合理的把js, html, css結(jié)合起來應(yīng)用。對html的準(zhǔn)確把握,不像學(xué)一般的編程語言那樣,而是建立在豐富實(shí)踐經(jīng)驗(yàn)和體會的基礎(chǔ)上,是前端的工程師的基本功。
這不是一道較真題或是裝逼題,正經(jīng)一道“畫雞蛋”的題,考的是基本功。代碼如其人,對一行代碼的理解足以反映出他的前端開發(fā)素養(yǎng)。
言歸正傳。這道題的考點(diǎn):
考點(diǎn)1:html和 xhtml的區(qū)別
這行代碼在html 4.01 strict下是完全正確的,在xhtml 1.0 strict下是錯(cuò)誤一堆的。所以明顯是一個(gè)考點(diǎn)。在xhtml下所有標(biāo)簽是閉合的,p,br需要閉合, 標(biāo)簽不允許大寫,P要小寫。同時(shí)nbsp和br必須包含在容器里。html下這些都不是錯(cuò)。p在html里是可選閉合標(biāo)簽,是可以不用閉合的。
這個(gè)考點(diǎn)告訴你xhtml是多么苛刻。這是基本考點(diǎn),答對,你能拿到60分。
考點(diǎn)2:考樣式分離
用nbsp控制縮進(jìn)是不合理的。應(yīng)該用CSS干這事。所以應(yīng)該刪掉nbsp
考點(diǎn)3:合理使用標(biāo)簽
br是強(qiáng)制折行標(biāo)簽,p是段落。原題用連續(xù)的br制造兩個(gè)段落的效果,效果是達(dá)到了,但顯然用的不合理,段落間距后期無法再控制。正確的做法是用兩個(gè)p表現(xiàn)兩個(gè)段落!拔艺f”后面是正常的文字折行用br是合理的。
上面全答對,你就能拿到100分。
對原題改進(jìn)的結(jié)果:
html 4.01:
<p>哥寫的不是HTML,是寂寞。<p>我說:<br> 不要迷戀哥,哥只是一個(gè)傳說
xhtml 1.0:
<p>哥寫的不是HTML,是寂寞。</p><p>我說:<br /> 不要迷戀哥,哥只是一個(gè)傳說</p>
加分:合理的用語義化標(biāo)簽
在前面的基礎(chǔ)上合理的用語義化標(biāo)簽,對內(nèi)容進(jìn)行必要的標(biāo)記,是加分的。但過度的使用標(biāo)簽,就畫蛇添足了。如“我說”的話,可以用q標(biāo)簽標(biāo)注。
<p>哥寫的不是HTML,是寂寞。
<p>我說:<br> <q>不要迷戀哥,哥只是一個(gè)傳說</q>
我覺得這就夠了,如果再進(jìn)一步,“我”用cite標(biāo)注,“HTML” 用abbr或acronym標(biāo)注(至于再討論abbr和acronym的區(qū)別就太較真了),也OK。再復(fù)雜就沒必要了。
<p> 哥寫的不是<abbr title=”Hyper Text Markup Language”>HTML</abbr>,是寂寞。
<p><cite> 我</cite>說:<br> <q>不要迷戀哥,哥只是一個(gè)傳說</q>
- 上一篇:CSS布局口訣
- 下一篇:已經(jīng)是最后一篇了