第一次网页前端培训笔记（HTML常用标签）

最新推荐文章于 2024-09-12 16:43:23 发布

木丶濯

最新推荐文章于 2024-09-12 16:43:23 发布

阅读量385

点赞数

文章标签：前端 html

本文链接：https://blog.csdn.net/qq_60225692/article/details/122775154

版权

1.编译器

HBuilderX

2.HTML概述

3.标签分类

分为单标签和双标签，

单标签又分为不含属性的和含属性的，

双标签也分为不含属性的和含属性的。

4.HTML基本框架

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		
	</body>
</html>

5.标题标签

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>这是一个HTML页面</title>
	</head>
	<body>
	<h1>标题1</h1>
	<h2>标题2</h2>
	<h3>标题3</h3>
	<h4>标题4</h4>
	<h5>标题5</h5>
	<h6>标题6</h6>
	</body>
</html>

运行结果

6.段落标签

<!-- 段落标签
	       p标签，会自动换行
		   块级元素-->
    <p>这是一个段落1</p>
	<p>这是一个段落2</p>

运行结果

7.换行标签

<br>

8.水平线标签

<hr />
	<hr color="red" size="3" width="50%" align="left" />

9.列表

分为无序列表和有序列表

无序列表

<ul>
		<li>周杰伦</li>
		<li>林俊杰</li>
		<li>陈奕迅</li>
	</ul>

有序列表

<ol >
		<li>周杰伦</li>
		<li>林俊杰</li>
		<li>陈奕迅</li>
	</ol>

10.div

10.span （行内元素不会自动换行）

11.格式化标签

<font color="aqua" size="5" face="楷体">你好</font>
	<pre>
Hello     world
	</pre>
	<p><b>以后</b>的<strong>你</strong>会<i>感谢</i>现在<u>努力</u>的<del>自己</del></p>
	H<sub>2</sub>O

12.a标签

13.img标签

<img  src="img/1.jpg" border="2" title="柯南" alt="这是一张图片"/>

14.表格标签

<table width="400px" align="center" border="1" style="border-collapse: collapse;">
		<tr>
			<th>编号</th>
			<th>姓名</th>
			<th>年龄</th>
		</tr>
		<tr>
			<td>1</td>
			<td>张三</td>
			<td>18</td>
		</tr>
		<tr>
			<td>2</td>
			<td>李四</td>
			<td>25</td>
		</tr>
		<tr>
			<td>3</td>
			<td>王五</td>
			<td>20</td>
		</tr>
	</table>

木丶濯

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
第一次网页前端培训笔记（HTML常用标签）

1.编译器HBuilderX2.HTML概述3.标签分类分为单标签和双标签，单标签又分为不含属性的和含属性的，双标签也分为不含属性的和含属性的。4.HTML基本框架<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> </head> <body> &l
复制链接

扫一扫