【HTML】html纯常用代码

表格

<table border="1px" height="300px" width="300px" align="center">
    <caption>表格</caption>
    <thead>
        <tr align="center">
            <th>表格name</th>
            <th>表格sex</th>
            <th>表格age</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>name1</td>
            <td rowspan="2">sex1</td>
            <td>age1</td>
        </tr>
        <tr>
            <td>name2</td>
            --------------
            <td>age2</td>
        </tr>
    </tbody>
</table>

布局标签

<header>头部 定义页眉</header>
<nav>定义导航链接的部分</nav>
<footer>页脚 页面底部</footer>
<article>定义文章</article>
<section>定义区域</section>
<aside>定义侧边</aside>

搜索出现内容

搜索：<input type="text" list="name" />
<datalist id="name">
    <option>岳飞</option>
    <option>秦葵</option>
    <option>李大招</option>
</datalist>

表单

<fieldset>
    <legend>用户登录</legend>
    <form>
        邮箱：<input type="email" > <br/>
        手机：<input type="tel" > <br/>
        url：<input type="url" > <br/>
        数字：<input type="number" > <br/>
        搜索：<input type="search" > <br/>
        区域滑块：<input type="range" > <br/>
        时间：<input type="time" > <br/>
        年月日：<input type="date" > <br/>
        年月日：<input type="datetime" > <br/>
        月份：<input type="month" > <br/>
        星期：<input type="week" > <br/>
        颜色：<input type="color" > <br/>
        <input type="submit" > <br/>
    </form>
</fieldset>

<form action="demo.py" method="post" name="新浪登录页面">
    用户名 ：<input type="text"/><br/>
    密&nbsp;码 ：<input type="password"/><br/>
    性&nbsp;别 ：<input type="radio" name="sex" /> 女 <input type="radio" name="sex"/> 男 <br/>
    爱&nbsp;好 ：<input type="checkbox" name="hobby" /> 足球
                <input type="checkbox" name="hobby" /> 唱歌 
                <input type="checkbox" name="hobby" /> 摸鱼 <br/>
    搜&nbsp;索 ：<input type="button" value="搜索啥" /> <br/>
 	--------------------- <br/>
    <input type="submit" value="提交" /> <br/>
    <input type="reset" value="重置" /> <br/>
    <input type="image" src="/Users/ym/Downloads/zenv/0.jpeg" width="300px"/> <br/>
    上传头像 ：<input type="file"/> <br/>
    <label>输入账号label1 ：<input type="text" /> </label>
    <label for="2">输入账号label2 ：<input type="text" /> <input type="text" id="2"/></label>
    <textarea cols="90" rows=20">文本内容</textarea>
    下拉菜单：
    <select>
        <option selected>武汉</option>
        <option>襄阳</option>
        <option>十堰</option>
        <option>黄冈</option>
        <option>宜昌</option>
    </select>
    <select>
        <option>矿泉水</option>
        <option>凉虾米</option>
        <option selected>热干面</option>
        <option>冰凉粉</option>
        <option>小龙虾</option>
        <option>自助餐</option>
        <option>欢乐谷</option>
    </select>
</form>

<form action="" >
    用户名1：<input type="text" placeholder="请输入用户名" autofocus > <br/>
    用户名2：<input type="text" required accesskey="s"> <br/>
    保留记忆电话号码：<input type="text"  autocomplete name="number"> <br/>
    上传文件：<input type="file" multiple> <br/>
    <input type="submit" value="提交"> <br/>
</form>

音视频

<embed url="【我为何如此偏爱晴雯？说给一位高考生《红楼梦》人物品评-哔哩哔哩】 https://b23.tv/moc0GHD"></embed>
<audio autoplay controls loop>
    <source  src="/Users/ym/Downloads/PuppyMmmm,Asteroiz-His Theme (Orchestral Intro Edit).oggl">
    <source  src="/Users/ym/Downloads/PuppyMmmm,Asteroiz-His Theme (Orchestral Intro Edit).mp3">
    <source  src="/Users/ym/Downloads/PuppyMmmm,Asteroiz-His Theme (Orchestral Intro Edit).Wav">
</audio>
<video autoplay controls loop id="页尾">
    <source  src="/Users/ym/Downloads/屏幕录制2023-06-09 17.05.30.mov">
    <source  src="/Users/ym/Downloads/屏幕录制2023-06-09 17.05.30.mov">
    <source  src="/Users/ym/Downloads/屏幕录制2023-06-09 17.05.30.mov">
</video>

基础标签

<h1 id="页首">一级标题</h1>
<h2>二级标题</h2>
<br>换行标签
<p>段落标签</p>
<hr/>水平线标签
<div>布局标签div</div>
<span>布局标签span</span>


<b>加粗</b>
<strong>加粗推荐</strong>
<i>斜体</i>
<em>斜体推荐</em>
<s>删除线</s>
<del>删除线推荐</del>
<u>下划线</u>
<ins>下划线推荐</ins>


<hr width="600" color="red" />标签属性
<img src="/Users/ym/Downloads/zenv/0.jpeg" height="300px" border="10px"/>
<img src="/Users/ym/Downloads/zenv/0.jpeg" alt="大眼睛搞怪" title="点我也没用" width="300px"/>
<a href="https://www.baidu.com" target="_blank">点我跳转百度</a>
<a href="#页首">锚点定位页首</a>
<a href="#页尾">锚点定位页尾id="页尾"</a>
<base target="_blank" />


特殊字符：&nbsp;&nbsp;
<ul>
    <li>无需列表1</li>
    <li>无需列表2</li>
</ul>
<ol>
    <li>有序列表1</li>
    <li>有序列表2</li>
</ol>
<dl>
    <dt>自定义列表标题</dt>
    <dd>自定义列表1</dd>
    <dd>自定义列表2</dd>
    <dt>自定义列表标题</dt>
    <dd>自定义列表1</dd>
    <dd>自定义列表2</dd>
</dl>