HTML&CSS實現表格隔行顯示


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>JavaScript實現表格隔行顯示</title>
        <style type="text/css">
            #tbl_main {
                border: black thin solid;
            }
            
            .style01 {
                background-color: lightgray;
            }
        </style>
    </head>

    <body>
        <table id="tbl_main" border="0" cellspacing="2" cellpadding="2">
            <tr>
                <th class="style01">序號</th>
                <th class="style01">訂單號</th>
                <th class="style01">商品名稱</th>
                <th class="style01">價格</th>
            </tr>
            <tr>
                <td>1</td>
                <td>1045900</td>
                <td>Niket透氣減震運動鞋</td>
                <td>299</td>
            </tr>
            <tr>
                <td class="style01">2</td>
                <td class="style01">1045926</td>
                <td class="style01">天意美魚嘴女單鞋</td>
                <td class="style01">189</td>
            </tr>
            <tr>
                <td>3</td>
                <td>1045933</td>
                <td>海賊王船模型</td>
                <td>19.5</td>
            </tr>
            <tr>
                <td class="style01">4</td>
                <td class="style01">1045300</td>
                <td class="style01">福爾摩斯探案大全集</td>
                <td class="style01">22.5</td>
            </tr>
        </table>
    </body>

</html>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM