HTML基础总结

最新推荐文章于 2023-07-28 17:44:43 发布

原创最新推荐文章于 2023-07-28 17:44:43 发布 · 129 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#HTML

本文详细介绍了HTML的基本概念，包括HTML的定义、页面结构、常用标签及其属性。从段落、标题到表格、表单，全面覆盖网页设计所需的基础元素。

1、HTML概述

HTML：HyperText Markup Language 是一种用于创建网页的标准标记语言。
超文本：可以添加对其他文件的链接。
标记语言：通过一组标签，由浏览器解释执行

2、HTML(5)页面基本框架

<!DOCTYPE html>
<html>

<head>
    <title> </title>
    <meta charset="utf-8">
</head>

<body>
</body>

</html>

3、HTML基本标签

<p> </p>	<!-- 段落标签 -->

<h[1|2|3|4|5|6]> </h[1|2|3|4|5|6]>	<!-- 标题标签 -->

<font color="颜色" size="大小1-7" face="字体样式"> </font>	<!-- 字体标签 --> 
	===>	<span> </span>
	
<br />	<!-- 换行标签 -->

<hr />	<!-- 水平线 -->

<b> </b>	<!-- 加粗 --> 
	===>	<strong> </strong>
	
<i> </i>	<!-- 斜体 --> 
	===>	<em> </em>
	
<img src="图片路径" width="图片宽度" height="图片高度" alt="图片加载错误时的提示信息">	<!-- 图片标签 -->

<!-- 列表标签 -->
<ul type="样式" start="起始索引">	<!-- 无序列表 -->
	<li> </li>	<!-- 列表项 -->
</ul>

<ol type="样式" start="起始索引">	<!-- 有序列表 -->
	<li> </li>
</ol>

<a href="要访问的链接地址" target="浏览器标签页的打开方式">	<!-- 超链接标签 -->

<!-- 表格标签 -->
<table border="边框" width="宽度" height="高度" bgcolor="背景颜色" align="对齐方式">
	<tr>	<!-- 表格行标签 -->
		<td colspan="跨列合并" rowspan="跨行合并">	<!-- 表格列标签 -->
		</td>
	</tr>
</table>

<!-- 表单标签 -->
<form action="提交的地址" method="提交的方式[get|post]">
	<input type="类型[text|password|radio|checkbox|file|submit|button|reset|hidden|date|tel|number]" name="提交标签的name" id="提交标签的id" placeholder="默认的提示信息">	<!-- 提交标签 -->
	<textarea cols="指定宽度" rows="指定高度"> </textarea>	<!-- 文本域 -->
	<select>	<!-- 下拉列表-->
		<option>	<!-- 选择项-->
	</select>
</form>

<!-- 框架标签 -->
<framset>	<!-- 使用了frameset必须将body删掉 -->
	<fram name="" src="引入html文件地址">
</framset>
	===> div + css

<!-- 块标签 -->
<div> </div>
<sapn> </span>