Html基础标签

在标签中必须有name标签在发送请求的时候才能被传递到后端

其中标签种类细分为

  1. 段落标签<p>
  2. 文字标签<h1>-<h7>
  3. 超链接标签<a>
  4. 图片标签<img>
  5. 表格标签<table></table>中包裹<tr><</tr>行标签中包裹<td></td>列标签
  6. 列表标签<ol></ol>有序标签 <ul></ul>无需标签
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <p id="top">首页锚链接</p>
    <!--<br/>标签是换行标签   <hr/>标签是横线标签 分割html页面-->
    <!--h标签 主要区别字体大小不同 h1-h7-->
    <h1>常规标签</h1>
    <hr/>
    <h2>常规标签 </h2>
    <h3 class="text">常规标签</h3>
    <h7>常规标签</h7>
    <!--p标签 段落标签 标签内的文字会放到一个段落中-->
    <p>先帝创业未半而中道崩殂，今天下三分，益州疲弊，此诚危急存亡之秋也。然侍卫之臣不懈于内，忠志之士忘身于外者，盖追先帝之殊遇，欲报之于陛下也。诚宜开张圣听，以光先帝遗德，恢弘志士之气，不宜妄自菲薄，引喻失义，以塞忠谏之路也。</p>
    <p>宫中府中，俱为一体，陟罚臧否，不宜异同。若有作奸犯科及为忠善者，宜付有司论其刑赏，以昭陛下平明之理，不宜偏私，使内外异法也。</p>
    <!--a标签 超链接标签 在href中可以控制跳转的页面  target属性可以控制调试是在当前页面还是新页面
           其中图片可以嵌套在超链接标签中 实现点击图片来跳转网页-->
    <a href="https://www.baidu.com" target="_blank">百度一下</a>
    <!--通过href锁定锚链接可以控制页面位置-->
    <a href="#top">回到首页</a>
    <a href=javascript:a()><img src="../u=1058959968,828199315&fm=26&fmt=auto&gp=0.webp"></a><br/>
    <!--img标签 图片标签 src中填写具体图片的路径-->
    <img src="../u=1058959968,828199315&fm=26&fmt=auto&gp=0.webp" >
    <!--表格标签 外层是table标签包裹 tr表示行数据 里面包裹着td表示列数据-->
    <table>
        <tr>
            <td colspan="2">一号四点</td>
            <td>二号</td>
        </tr>
        <tr>
            <td>一号</td>
            <td>二号</td>
            <td>三号</td>
        </tr>
        <tr>
            <td>一号</td>
            <td>二号</td>
            <td>三号</td>
        </tr>
    </table>
    <!--有序列表标签 里面用li标签包裹-->
    <ol>
        <li>java</li>
        <li>javascript</li>
        <li>javaweb</li>
    </ol>
    <!--无序列表标签 里面用li标签包裹-->
    <ul>
        <li>java</li>
        <li>javascript</li>
        <li>javaweb</li>
    </ul>
    <p class="top">首页</p>
</body>
</html>

Html表单标签

<form></form>可以规定属性 method=“post"或者method="get"来区别表单提交的方式

  • 输入标签
  • <input>标签

        其中type属性有


        <!--input标签 其中type属性有 text password email         radio(单选框) textarea checkboxes（多选框） select（下拉列表）submit reset-->


  • 提交标签

<input type="submit" name="发布" value="发布">表示提交表单的按钮 <input type="reset" value="重置">重置表单中内容的按钮


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <!--表单标签-->
    <form method="post">
        <!--input标签 其中type属性有 text password email
        radio(单选框) textarea checkboxes（多选框） select（下拉列表）submit reset-->
        用户名<input type="text" class="yonghuming" name="username"><br/>
        秘密<input type="password" name="pwd"><br/>
        邮箱<input type="email" name="email"><br/>
        <!--单选框-->
        性别<input type="radio" value="男" name="sex">男
        <input type="radio" value="女" name="sex">女<br/>
        <!--多选框 通过name将其绑定在一起 来区别那些选项是一个组的-->
        <input type="checkbox" name="hobby" value="篮球">篮球
        <input type="checkbox" name="hobby" value="足球">足球
        <input type="checkbox" name="hobby" value="橄榄球">橄榄球<br/>
        <input type="checkbox" name="re" value="睡觉">睡觉
        <input type="checkbox" name="re" value="吃饭">吃饭<br/>
        <!--下拉框-->
        <select name="chese">
            <option>中国</option>
            <option>美国</option>
            <option>韩国</option>
        </select><br/>
        <!--文档输入框-->
        <textarea name="area"></textarea><br/>
        <!--文件上传-->
        <input type="file" name="file">
        <input type="submit" name="发布" value="发布">
        <input type="reset" value="重置">
    </form>
</body>
</html>