zoukankan      html  css  js  c++  java
  • HTML的day1 HTML的标签

    a标签和锚点

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    
    
    <!--超链接地址前加http&ndash;&gt; http://www.baidu.com-->
    <a href="http://www.baidu.com" target="_blank">百度</a><br/>
    <a href="#i1">第一章</a>&nbsp;
    <a href="#i2">第二章</a>&nbsp;
    <a href="#i3">第三章</a>&nbsp;
    <a href="#i4">第四章</a>&nbsp;
    <div id="i1" style="height: 500px;"><a>第一章内容</a></div>
    <div id="i2" style="height: 500px;"><a>第二章内容</a></div>
    <div id="i3" style="height: 500px;"><a>第三章内容</a></div>
    <div id="i4" style="height: 500px;"><a>第四章内容</a></div>
    
    </body>
    </html>

    html的form表单

    
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>表单测试搜索</title>
    </head>
    <body>

    <!--<form action="https://www.sogou.com/web" method="get">-->
    <!--<div>-->
    <!--<input type="text" name="query" />-->
    <!--<input type="submit" value="搜索"/>-->
    <!--</div>-->
    <!--</form>-->

    <div>

    <h1>一级标题</h1>
    <h2>二级标题</h2>
    <span>hello</span>
    <span>hello</span>
    <span>hello</span>
    </div>


    <form action="" method="get" enctype="multipart/form-data">
    <div>
    <input type="password" value="密码框">
    <input type="text" value="默认文本框">
    <input type="button" value="登录">
    <p>请输入你的选择</p>
    <p><input type="radio" name="genetor" value="1"/>男</p>
    <p><input type="radio" name="genetor" value="2"/>女</p>
    <p><input type="checkbox" name="fav" ,value="1">长江</p>
    <p><input type="checkbox" name="fav" ,value="2" checked="checked">黄河</p>
    <p><input type="file" name="fname">上传文件</p>
    <p><input type="submit" value="提交"/></p>
    <p><textarea name="meno">多行文本此处为默认值</textarea></p>
    <p><select name="city" multiple="multiple">

    <optgroup label="江苏">

    <option value="1">常州</option>
    <option value="2">镇江</option>
    <!--selected表示默认勾选-->
    <option value="3" selected="selected">无锡</option>

    </optgroup>


    </select></p>
    <p><input type="reset" value="重置"></p>

    </div>
    </form>
    <form>
    <ul>
    <li>aaa</li>
    <li>bbb</li>
    <li>ccc</li>
    </ul>
    <ol>
    <li>123</li>
    <li>233</li>
    <li>333</li>


    </ol>
    <dl>
    <dt>111</dt>
    <dd>aaa</dd>
    <dd>bbb</dd>
    <dd>ccc</dd>
    </dl>
    <table border="1">
    <tr>
    <td>主机IP</td>
    <td>端口</td>
    <td>操作</td>
    </tr>
    <tr>
    <td>172.20.59.127</td>
    <td>8888</td>
    <td><a href="#">查看详细</a>&nbsp;<a href="#">删除</a></td>
    </tr>
    <tr>
    <td>172.20.90.114</td>
    <td>9999</td>
    <td><a href="#">查看详细</a>&nbsp;<a href="#">删除</a></td>
    </tr>


    </table>


    <table border="1">
    <thead>
    <tr>
    <th>表头1</th>
    <th>表头2</th>
    <th>表头3</th>
    <th>表头4</th>
    </tr>

    </thead>
    <tbody>
    <tr>
    <td>1</td>
    <td>2</td>
    <td colspan="2">3</td>
    </tr>
    <tr>
    <td>11</td>
    <td>22</td>
    <td>33</td>
    <td>44</td>
    </tr>


    </tbody>


    </table>
    </form>

    </body>
    </html>
     

    input标签与label标签创建关联  主要是for方法

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>input标签与label创建关联</title>
    </head>
    <body>
    <label for="username">用户名:</label>
    <input id="username" type="text" name="user">
    
    
    
    <fieldset>
        <legend>登录</legend>
        <label for="uname">用户名</label>&nbsp;<input type="text"  id="uname" name="user"/><br />
        <label for="passwd">密码</label>&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" id="passwd" name="passowrd">
    
    </fieldset>
    </body>
    </html>
  • 相关阅读:
    洛谷 P5677 [GZOI2017]配对统计(树状数组)
    洛谷 P2471 [SCOI2007]降雨量(RQM)
    洛谷 P4588 [TJOI2018]数学计算(线段树)
    洛谷 P1198 [JSOI2008]最大数(线段树)
    扫描线 && 洛谷 P5490 【模板】扫描线(线段树)
    洛谷 P6033 [NOIP2004 提高组] 合并果子 加强版(桶排序,队列)
    目标检测------>>>>R2CNN_Faster-RCNN_Tensorflow项目环境得配置
    python实现aes-256-gcm加密和解密-自已动手写个加解密软件(二)
    虚拟机改密码方案
    316python 基础之计算机基础、Python简介、变量、注释、基础数据类型初识、if、while、语句
  • 原文地址:https://www.cnblogs.com/nodchen/p/8955813.html
Copyright © 2011-2022 走看看