1. 程式人生 > >html標籤應用

html標籤應用

<!DOCTYPE html>
<html>
<head>
    <title>information</title>
    <style>
        .div1{                                          /*類
            background-color:#930;
            font-size:15px;
            float:center;
        }
        .div2{
            background-color:#9d9d9d;
            float:center;
        }
        .div3{
            text-align:center;
        }
    </style>
    <style type="text/css">
        table,th,tr,td{                     /* 分組選擇
        border:1px
        solid #000;
        text-align:center;
    }
    </style>
</head>
<body>
    <h1 style="text-align: center">my computer</h1><!--標題居中-->
    <hr/>
    <h2>computer&nbsp;parts</h2>
    <div align="center"><img src="http://p0.so.qhimgs1.com/bdr/_240_/t01ded85a9306759cc0.jpg"></div>
    <div class="div3">i3-4130,<strong>gtx1050ti,</strong>120ssd,500gdisk,b85,thegreatwall350w,12gdrr3,24ipsaocviewingscreen
        <address><a href="https://www.taobao.com/">(from taobao)</a></address><br/>
    <blockquote>少年聽雨歌樓上,<br/>紅燭昏羅帳。<br/>壯年聽雨客舟中,<br/>江闊雲低,斷雁叫西風。<br/></blockquote>
    <pre>public class one{
        public static void main(string[] args){
        System.out.println("this is a code")
    }
    }
};  </pre></div><br/>
    <hr/>
    <h2>how to use the computer</h2>
    <div class="div1">
    <ol>
        <li>play&bnsp;game</li>
        <li>watching&bnsp;movie</li>
        <li>searching&bnsp;information</li>
        <li>study</li>
    </ol>
    </div>
        <table summary="111">
            <caption>computer use</caption>
            <tbody>
                <tr>
                    <th>game</th>
                    <th>movie</th>
                    <th>study</th>
                </tr>
                <tr>
                    <td>lol</td>
                    <td>rings-king</td>
                    <td>front-end</td>
                </tr>
                <tr>
                    <td>dnf</td>
                    <td>titanic</td>
                    <td>ui</td>
                </tr>
            </tbody>
        </table><br/>
        <hr/>
    <h2>let's to take a survey</h2>
    <form method="post" action="file.php">
        </div><label><strong>name:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;   </strong></label>
        <input type="text" name="myname"><br/><br/>
        <label><strong>password:</strong></label>
        <input type="password" name="password"><br/><br/>

        <label><strong>gender:</strong></label>
        <label for="man">man</label>
        <input type="radio" name="gender" value="nan" id="man">
        <label for="women">women</label>
        <input type="radio" name="gender" value="nv" id="women"><br/><br/>

        <label><strong>university:</strong></label>
        <select>
            <option value="清華大學">清華大學</option>
            <option value="北京大學">北京大學</option>
            <option value="武漢大學">武漢大學</option>
            <option value="復旦大學">復旦大學</option>
        </select><br/><br/>

        <label><strong>favourite</strong></label><br/><br/>
        <select multiple="multiple">
            <option value="game">game</option>
            <option value="movie">movie</option>
            <option value="music">music</option>
            <option value="dance">dance</option>
            <option value="van">van</option>
        </select><br/><br/>

        <label><strong>be good at</strong></label><br/><br/>
        <input type="checkbox" value="1" name="basketball" id="basketball">
        <label for="basketball">basketball</label><br/>
        <input type="checkbox" value="2" name="soccer" id="soccer">
        <label for="soccer">soccer</label><br/>
        <input type="checkbox" value="3" name="pingpang" id="pingpang">
        <label for="pingpang">pingpang</label><br/>
        <input type="checkbox" value="4" name="yumao" id="yumao">
        <label for="yumao">yumao</label><br/><br/>

        <label><strong>leave a message</strong></label><br/><br/>
        <textarea rows="10" cols="40"></textarea> <br/><br/>
        <input type="submit" value="submit">
        <input type="reset"  value="reset">
        <br/><br/>
        <hr/>
    </form>
</body>
</html>

 

html基礎標籤應用