HTML初学

1.基本标签

<h2>

<p>段落标签

<br/>换行标签

<hr/>水平线

<strong> 粗体

<em> 斜体 

<a href="" target="(_blank新页面 , _self当前页面),(可跳转内联框架指定"name")">(超链接)

<a href="(#name)" >(跳转位置如底部跳转头部)

2.媒体控件

<img src=""  title=""悬停文字 width="" height="">

<video src=""  controls(控制条)  autoplay(自动播放)>(视频)

<audio src="" controls(控制条)  autoplay(自动播放)>(音乐)

<iframe src=""  name="hello">(内联框架,显示网页)

3.特殊字符

&nbsp 空格

&copy  @

&gt  >

&lt  <

4.列表

<ol>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
</ol>(有序列表)
<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
</ul>(无序列表)
<dl>
    <dt>123</dt>
    <dd>1</dd>
    <dd>2</dd>
    <dd>3</dd>
    <dd>4</dd>
    <dt>456</dt>
    <dd>1</dd>
    <dd>2</dd>
    <dd>3</dd>
    <dd>4</dd>
</dl>(自定义列表)

5.表格

<table border="1px">
    <tr>
        <td colspan="3" align="center">学生成绩</td>
    </tr>
    <tr>
        <td rowspan="2">cfj</td>
        <td>语文</td>
        <td>102</td>
    </tr>
    <tr>
        <td>数学</td>
        <td>102</td>
    </tr>
    <tr>
        <td rowspan="2">尘封</td>
        <td>语文</td>
        <td>102</td>
    </tr>
    <tr>
        <td>数学</td>
        <td>102</td>
    </tr>
</table>

6.表单

  
   readonly 只读
   hidden 隐藏
   required 不能为空
   pattern 正则表达式
   disabled 禁用
   placeholder  提示

<form action="提交之后跳转的页面" method="(post)(get)">
<p>账号: <input type="text" name="username" placeholder="请输入"  required></p>
<p>密码: <input type="password" name="password" hidden></p>

多选框
<p><input type="checkbox" name="checkbox">A</p>
<p>      <input type="checkbox" name="checkbox">B</p>
<p>      <input type="checkbox" name="checkbox">C</p>
提交
<p> <input type="submit"> <input type="reset"  ></p>

单选框(name需要一样)
<p>  <input type="radio" checked(默认) value="boy" name="sex" >男
     <input type="radio" value="girl" name="sex">女
</p>
文件
<p><input type="file"></p>
图片
<p><input type="image" src="../resources/image/1.gif" value="123"></p>
下拉列表框
<p>选项:
    <select name="列表名称" id="">
        <option value="选项的值">1</option>
        <option value="选项的值">2</option>
        <option value="选项的值" selected(默认)>3</option>
        <option value="选项的值">4</option>
    </select>
</p>
文本域
<p>
    <textarea name="textatea" cols="30" rows="10"></textarea>
</p>
email:格式
<p>
    <input type="email" name="email">
</p>

URL:

<p>URL:<input type="url" name="url"></p>

数字
<p>:
    <input type="number" name="num" max="1 00" min="0" step="10">
</p>
滑动
<p>
    <input type="range" max="100" min="1" name="range" step="5">
</p>
搜索
<p><input type="search" name="search"></p>
鼠标可用性
<p>
    <label for="a">点击</label>
    <input type="text" id="a">
</p>
正则表达式
<p>
    <input type="text" name="diymail" pattern="
    [1-9]([0-9]{4,10})">
</p>
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值