HTML学习

最新推荐文章于 2022-10-12 15:45:09 发布

蕾姆的48六

最新推荐文章于 2022-10-12 15:45:09 发布

阅读量249

点赞数

分类专栏：前端文章标签： HTML

本文链接：https://blog.youkuaiyun.com/k1159/article/details/126069883

版权

前端专栏收录该内容

3 篇文章

订阅专栏

这篇博客主要介绍了HTML的学习内容，包括HTML的结构、标签使用、多媒体元素、超链接、表格、各种列表类型以及表单元素如input、select和textarea的用法，强调了HTML在构建网页结构中的重要性。

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

【结构为主！】
【写HTML考虑文章结构】

标签Tag

在这里插入图片描述

HTML格式

在这里插入图片描述

<h>标题</h>
<p>段落</p>
<br><!--换行-->


<!--格式化标签，不常用-->
<strong>很重的强调</strong>
    <em>强调</em>
    <del>删除</del>
    <ins>插入</ins>
<!--浏览器默认样式-->
    <b>加粗</b>
    <i>斜体</i>
    <u>下划线</u>
    <s>中划线</s>

在这里插入图片描述

多媒体标签

<!--图片-->
    <img src="图片路径" alt="图片描述内容"><!--内联元素-->
    <img src="图片路径" alt="图片描述内容">
    <img src="http://127.0.0.1:8080/图片1.png" alt="图1-绝对路径-全路径">
    <img src="/图片1.png" alt="图2-绝对路径-没有服务器信息">
    <img src="./图片1.png" alt="图3-相对路径">
    <img src="图片1.png" alt="图4-相对路径-省略点+斜杠">
    <img style="width : 100px;height : 100px" src="图片1.png" alt="图7--设置宽高为100像素">
    <!--这些图片路径都是在static文件夹下的-->
    <!--音频-->
    <audio src=""></audio>
    <!--视频-->
    <video src=""></video>

超链接

<a href="https://www.bilibili.com/">我滴超链接</a>

表格

<table><!--外层-->
	<thread>
	<tr>
		<th ></th><!--表头内容-->
	</tr>
</thread><!--表头-->

<tbody><!--表内容-->
	<tr>
		<td></td><!--填写的内容-->
	</tr>
</tbody>
</table>

列表标签

有序标签

在这里插入图片描述

无需标签

在这里插入图片描述

自定列表

在这里插入图片描述

form表单–提交内容

在这里插入图片描述

<form action="提交资源的路径，默认是当前资源" method="post" enctype="text/plain">
    <!--method本次提交采用什么HTTP协议是什么方法，默认是get-->
    <!--enctype提交时，数据编码类型-->
    <button><!--提交按钮-->
    </button>
</form>