其他分享
首页 > 其他分享> > day026html

day026html

作者:互联网

## html02

```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>form01</title>
</head>
<body>
<h3>form 表单提交</h3>
   <form action="myWeb.html" method="get"> <!--//表单可以提交到一个网页也可以是一个请求-->
       <p>name:<input name="name" type="text" required/></p>
       <p>psw:<input name="psw" type="text" placeholder="请输入密码"/></p>
        <p>自定义邮箱:parrent<input type="email" placeholder="请输入正确邮箱"
        pattern="[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$"
        /></p>
       <!--表单验证 placeholder 默认值提示信息 required 非空  pattern 正则表达式-->
       <p>password:<input name="password" type="password"/></p>
       <p>text默认 maxlength最多输入字符数:<input name="text" type="text" maxlength="10"/></p>
       <p>radio:单选框<input name="sex" type="radio" value="man"/></p>
       <p>radio:<input name="sex" type="radio" value="girl"/></p>
       <p>checkbox:多选框<input name="ss" type="checkbox" /></p>
       <p>checkbox:<input name="ss" type="checkbox" /></p>
       <p>button<input name="btn" type="button" value="click long"/></p>
       <p>image:图片按钮<input name="image" type="image" src="../img/xc.jpg" width="20px" height="20px"/></p>
       <p>file<input name="files" type="file" value="dddd"/></p>
       <p>email会自动验证包含@<input name="email" type="email" value="email0000"/></p>
       <p>url自动验证<input name="url" type="email" value="url0"/></p>
       <p>number数字<input name="number" type="number" value="number2"/></p>
       <p>
           滑块音量:range step="2"每一步增量
           <input type="range" max="10" min="0" step="2" name="voice"/>
       </p>
       <p>
           搜索:
           <input id="search" type="search" name="search"/>
       </p>
       <label for="search">点击指向位置</label>
       <p>
           <select name="select1">
               <option value="dd">china</option>
               <option value="usa">usa</option>
               <option value="v">girls</option>
           </select>
       </p>
       <p>
           <textarea name="textares" cols="10" rows="5">textarea</textarea>
       </p>
       <input type="submit" value="提交"/>
       <input type="reset" value="重置"/>
    </form>
</body>
</html>



<!DOCTYPE html>
<html lang="en"><!--网页总标签-->
<head><!--头部标签-->
    <meta charset="UTF-8"><!--描述标签-->
    <meta name="keywords" content="我的网页">
    <meta name="description" content="来这里练习">
    <title>frist web</title><!--网页标题-->
</head>
<body><!--主体标签-->

<header>
    <h3>i am header</h3>
</header>

<section>i am section</section>

Hello Girl
<hr/>
<!--有序列表ol-->
<ol>
    <li>ol li1有序列表 多用于试卷问答形式</li>
    <li>ol li2</li>
    <li>ol li3</li>
    <li>ol li4</li>
</ol>
<ul>
    <li>ul li1无序列表 多用于导航侧边栏</li>
    <li>ul li1=2无序列表</li>
    <li>ul li1=3无序列表</li>
</ul>
<dl>
    <dt>dl 自定义列表中dt 多用在公司网站底部 </dt>
    <dd>dl dd </dd>
    <dd>dl dd </dd>
    <dd>dl dd </dd>
</dl>
<table border="1px">
    <tr>
        <td colspan="3">成绩</td>
        <!--<td>2</td>-->
        <!--<td>3</td>-->
    </tr>
    <tr>
        <td rowspan="2">1</td>
        <td>yuwen</td>
        <td>600</td>
    </tr>
    <tr>
        <!--<td>1</td>-->
        <td>shuxu</td>
        <td>300</td>
    </tr>
    <tr>
        <td rowspan="2">1</td>
        <td>英语</td>
        <td>322</td>
    </tr>
    <tr>
        <!--<td>1</td>-->
        <td>物理</td>
        <td>311</td>
    </tr>
</table>
<hr/>
<h1>wo shi h1</h1>
<p>i am p</p>
<b>i am b</b>
<i>i am i </i>
<strong>i am strong</strong><br/>
<span>up have a br</span>
<em>i am em</em>
<p>&nbsp;空 &nbsp;格</p>
<p>&gt;大于gt,&lt;小于lt,&copy;copy版权</p>
<img src="../img/xc.jpg" alt="我的第一个相亲对象" title="我是悬停显示" width="200px">
<a href="#a1" target="_blank" title="找锚点1" name="iam">点我去锚点1</a>
<video src="../mm/map.mp4" autoplay controls>video视频放器:autoplay 自动播放controls:进度条</video>
<audio src="../mm.mp3" controls> audio 音频播放器 </audio>
<img src="../img/xc.jpg" alt="我的第一个相亲对象" title="我是悬停显示" width="200px">
<img src="../img/xc.jpg" alt="我的第一个相亲对象" title="我是悬停显示" width="200px">
<img src="../img/xc.jpg" alt="我的第一个相亲对象" title="我是悬停显示" width="200px">
<img src="../img/xc.jpg" alt="我的第一个相亲对象" title="我是悬停显示" width="200px"><img src="../img/xc.jpg" alt="我的第一个相亲对象" title="我是悬停显示" width="200px">
<img src="../img/xc.jpg" alt="我的第一个相亲对象" title="我是悬停显示" width="200px">
<img src="../img/xc.jpg" alt="我的第一个相亲对象" title="我是悬停显示" width="200px">
<img src="../img/xc.jpg" alt="我的第一个相亲对象" title="我是悬停显示" width="200px">
<p id="a1">锚点1</p><a href="#" title="top">回顶部</a>


<footer>i am footer</footer>
<a href="www.jjc.com" target="hello">在内联框架中打开</a><!--在内联框架中打开-->
<iframe name="hello" src="http://www.hao123.com" width="1000px" height="600px" frameborder="1"></iframe>
</body>
</html>

标签:dl,ol,--,dd,am,day026html,li1
来源: https://www.cnblogs.com/wwwzhqwww/p/14398761.html