DIV 是給弱者準(zhǔn)備的

字號(hào):


    譯者注:當(dāng)我向作者 Tim Sluis 征詢翻譯許可時(shí),他的答復(fù)里提到了“你注意到了這是個(gè)玩笑的事實(shí),對(duì)吧?”。
    我們非常高興地宣布,我們,Studio Wolf 的狼群中隊(duì),將要在前端 web 開發(fā)中設(shè)定一種新趨勢(shì)。我們是第一家在代碼里完全轉(zhuǎn)向列表元素的公司,專門使用<ul>和<li>,不再使用<div>、<h1>、<p>等元素。
    <ul>
    <li>Hello world!</li>
    </ul>
    為什么?原因很簡(jiǎn)單:
    老實(shí)講,網(wǎng)頁(yè)除了列表嵌套列表,就沒有什么了;
    我們有 CSS 和 class。它們按你想要的方式為每個(gè)列表項(xiàng)設(shè)置樣式。不需要額外的標(biāo)簽;
    Google 鐘情于列表;
    真的太簡(jiǎn)單了。
    讓我們向你展示一個(gè)不錯(cuò)的清晰例子:
    <!doctype html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>We love UL</title>
    <meta name="description" content="">
    <meta name="author" content="">
    </head>
    <body>
    <ul>
    <li>
    <ul>
    <li>
    <ul>
    <li>
    <ul>
    <li href="#">Home</li>
    <li href="#">Products</li>
    <li href="#">About us</li>
    <li href="#">Contact</li>
    </ul>
    </li>
    <li>
    <ul>
    <li>We love lists.</li>
    <li>W3C is shitty.</li>
    <li>Div is for the weak.</li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    </li>
    <li>
    <ul>
    <li>
    <ul>
    <li>
    <ul>
    <li>This is my sidebar.</li>
    <li>Aliquam et rutrum tortor, nec pellentesque massa. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec bibendum dui dui, in feugiat nibh posuere ut. Phasellus vel imperdiet sapien.</li>
    </ul>
    </li>
    <li>
    <ul>
    <li>This is my content.</li>
    <li>Aliquam et rutrum tortor, nec pellentesque massa. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec bibendum dui dui, in feugiat nibh posuere ut. Phasellus vel imperdiet sapien.</li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    </li>
    </ul>
    </body>
    </html>
    web 大拿、web 忍者、專家們,以前都沒有執(zhí)行這種優(yōu)秀的思想,我們對(duì)此感到震驚。盡管采用這種新的編碼方式吧。我們非常肯定,世界上其他人將很快效仿。