html标签功能作用

最新推荐文章于 2025-02-20 19:37:20 发布

原创最新推荐文章于 2025-02-20 19:37:20 发布 · 289 阅读

0 ·

CC 4.0 BY-SA版权

HTML 专栏收录该内容

1 篇文章

订阅专栏

本文深入探讨了HTML标签的功能和用途，从基本的文本格式化标签到复杂的表单和多媒体元素，逐一解析其语法和使用场景。通过实例展示如何利用HTML标签构建网页结构，提升网页可读性和用户体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!-- 锚点链接可以链接到任意标签id="one"的标签处
	_blank重新打开一个标签页
 	_parent在当前页打开标签页
 -->
<a href="#one" target="_blank">Maps</a>

<!-- src可以是https,亦可以是file -->
<img src="https://www.w3school.com.cn/i/eg_tulip.jpg" alt="郁金香">
<img src="img/eg_tulip.jpg"  alt="上海鲜花港 - 郁金香" />

<!-- table用于展示数据
	td 可以换成 th 实现加粗效果
	cellpadding修改td的内部边距，cellspaceing修改td外部边距
	合并单元格clospan="2"向右合并，rowspan="2"向下合并
	table>thead>tr>td*3^^tbody>tr*2>td*3
 -->
    <table border="1" cellpadding="2" cellspacing="0" width="500">
        <thead>
            <tr>
                <td>姓名</td>
                <td>性别</td>
                <td>年龄</td>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>张学友</td>
                <td>男</td>
                <td>33</td>
            </tr>
            <tr>
                <td>郭富城</td>
                <td>男</td>
                <td>34</td>
            </tr>
        </tbody>
    </table>

<!-- 无序列表 -->
<ul>
   <li>Coffee</li>
   <li>Tea</li>
   <li>Milk</li>
</ul>
<!-- 有序列表 -->
<ol>
   <li>Coffee</li>
   <li>Tea</li>
   <li>Milk</li>
</ol>
<!-- 自定义列表 -->
<dl>
   <dt>计算机</dt>
   <dd>用来计算的仪器 ... ...</dd>
   <dt>显示器</dt>
   <dd>以视觉方式显示信息的装置 ... ...</dd>
</dl>

<!-- form中的是表单域
	input是表单元素
	input type=text,password,radio,checkbox,file
	button	普通按钮
	reset	重置按钮
	submit 提交按钮 
	action	
	是把表单以 name=value 的形式 method 的方法提交到另一个页面
	label	for=id 点标签内的内容等于点表单元素
	select	下拉框 selected
	textarea	文本框
 -->
<form action="index2.html" method="GET">
        <div class="a1">
            <label for="username">username:</label>
            <input type="text" name="username" value="username" maxlength="6" id="username">
        </div>
        <div class="a1">
            <label for="password">password:</label>
            <input type="password" name="pwd" value="password" id="password">
        </div>
        <div class="a1">
            sex:
            <input type="radio" name="sex" value="man" id="man" checked>
            <label for="man">man</label>
            <input type="radio" name="sex" value="woman" id="woman">
            <label for="woman">woman</label>
        </div>
        <div class="a1">
            hobby: 
            <input type="checkbox" name="hobby" value="sleep">sleep
            <input type="checkbox" name="hobby" value="game">game
        </div>
        <div class="a1">
            provice:
            <select name="" id="">
                <option value="">shandong</option>
                <option value="">jiangxi</option>
                <option value="">jiangsu</option>
                <option value="" selected>beijing</option>
                <option value="">shanghai</option>
            </select>
        </div>
        <div class="a1">
            ps:
            <textarea name="" id="" cols="40" rows="2">ps</textarea>
        </div>
        <div class="a1">
            upload:
            <input type="file" value="file" name="file">
        </div>
        <div class="a1">
            <input type="checkbox" checked>
            I agree
        </div>
        <div></div>
        <div class="a1">
            <div class="b1">
                <input type="button" value="button" class="c1">
                <input type="reset" value="reset" class="c1">
                <input type="submit" value="submit" class="c1">
            </div>
        </div>
    </form>