JavaWeb——Html

1. font标签

<font color="red" face="宋体" size=5>Hello world</font>

2. 特殊字符

3. 标签

<h1 align="center">标题</h1>

4. 超链接

<a href="http://www.baidu.com">百度</a>

5. 列表

<!--unordered list-->
<ul type="none">
    <!--list item-->
    <li>dcd</li>
    <li>dcdnp</li>
    <li>dcdn</li>
    <li>dcdp</li>
</ul>

<ol>
    <li>dcd</li>
    <li>dcdnp</li>
    <li>dcdn</li>
    <li>dcdp</li>
</ol>

6. img显示图片

<!--展示图片-->
<img src="../img/img1.png" width="500" height="500" border="2" alt="不给你看"/>

7. 表格

<table border="1" width="200" height="200" cellspacing="0">
<!--    tablerow-->
    <tr>
        <!--    tableheadercell-->
        <th>1.1</th>
        <th>1.2</th>
        <th>1.3</th>
    </tr>
    <tr>
        <!--        tabledatacell-->
        <td>2.1</td>
        <td>2.2</td>
        <td>2.3</td>
    </tr>
</table>

<table border="1" width="200" height="200" cellspacing="0">
<!--    tablerow-->
    <tr>
        <!--    tableheadercell-->
        <th colspan="2">1.1</th>
        <th>1.3</th>
    </tr>
    <tr>
        <!--        tabledatacell-->
        <td rowspan="2">2.1</td>
        <td>2.2</td>
        <td>2.3</td>
    </tr>
    <tr>
        <!--        tabledatacell-->
        <td>3.2</td>
        <td>3.3</td>
    </tr>
</table>

8. iframe

<iframe src="../img/img1.png" name="a" width="500" height="500"></iframe><br/>
<ul>
    <li><a href="Hello.html" target="a">1</a></li>
</ul>

9. 表单

<form>
    <h1 align="center">用户注册</h1>
    <table align="center">
        <tr>
            <th>用户名称：</th>
            <td><input type="text" value="用户名"/><br/></td>
        </tr>
        <tr>
            <th>用户密码：</th>
            <td><input type="password" value="123"/><br/></td>
        </tr>
        <tr>
            <th> 性别：</th>
            <td>
                <input type="radio" checked="checked" name="sex">男
                <input type="radio" name="sex">女<br/>
            </td>
        </tr>
        <tr>
            <th>兴趣爱好：</th>
            <td>
                <input type="checkbox" checked="checked">java
                <input type="checkbox">c++
                <input type="checkbox">javaScript<br/>
            </td>
        </tr>
        <tr>
            <td> 国籍：</td>
            <td>
                <select>
                    <option>--请选择国籍--</option>
                    <option selected="selected">--中国--</option>
                    <option>--美国--</option>
                </select><br/>
            </td>
        </tr>
        <tr>
            <td>自我评价：</td>
            <td>
                <textarea rows="10" cols="10">默认值</textarea><br/>
            </td>
        </tr>
        <tr>
            <td><input type="reset" value="重置按钮"></td>
            <td><input type="submit" value="提交按钮"></td>
        </tr>
        <tr>
            <td><input type="file" value="文件上传"></td>
            <td><input type="button" value="按钮"></td>
        </tr>
    </table>
</form>

表单的提交

<!--表单提交的细节：每一个标签需要设置name属性，单选和多选每一项要设置value属性，每一项都需要写在form标签内-->
<form action="http://localhost:8080" method="get">
    <input type="hidden" name="login">
    <h1 align="center">用户注册</h1>
    <table align="center">
        <tr>
            <th>用户名称：</th>
            <td><input type="text" value="用户名" name="user"/><br/></td>
        </tr>
        <tr>
            <th>用户密码：</th>
            <td><input type="password" value="123" name="password"/><br/></td>
        </tr>
        <tr>
            <th> 性别：</th>
            <td>
                <input type="radio" checked="checked" name="sex" value="man">男
                <input type="radio" name="sex" value="woman">女<br/>
            </td>
        </tr>
        <tr>
            <th>兴趣爱好：</th>
            <td>
                <input type="checkbox" checked="checked" name="hobby" value="java">java
                <input type="checkbox" name="hobby" value="cpp">c++
                <input type="checkbox" name="hobby" value="js">javaScript<br/>
            </td>
        </tr>
        <tr>
            <td> 国籍：</td>
            <td>
                <select name="country">
                    <option value="none">--请选择国籍--</option>
                    <option selected="selected" value="China">--中国--</option>
                    <option value="USA">--美国--</option>
                </select><br/>
            </td>
        </tr>
        <tr>
            <td>自我评价：</td>
            <td>
                <textarea rows="10" cols="10" name="desc">默认值</textarea><br/>
            </td>
        </tr>
        <tr>
            <td><input type="reset" value="重置按钮"></td>
            <td><input type="submit" value="提交按钮"></td>
        </tr>
        <tr>
            <td><input type="file" value="文件上传"></td>
            <td><input type="button" value="按钮"></td>
        </tr>
    </table>
</form>

10. 其他标签

div标签：默认独占一行
span标签：它的长度是数据的长度
p段落标签：默认会在段落的上方或下方空出一行