HTML练习笔记----1

最新推荐文章于 2025-05-12 18:22:43 发布

原创最新推荐文章于 2025-05-12 18:22:43 发布 · 179 阅读

1 ·

CC 4.0 BY-SA版权

语言了解专栏收录该内容

10 篇文章

订阅专栏

本文深入讲解HTML基础标签的使用，包括段落、标题、图片、链接等元素的特性及应用场景，帮助初学者快速掌握HTML基本语法。

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

HTML 基础标签

一个简单的THML文件


<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body><!--body元素定义了HTML文件的主体-->
	<h2 align="center">练习笔记</h2><!--此处为标题部分-->
	<p>没有内容的HTML内容称为<strong>空元素</strong>，<b>空元素</b>是在开始标签中关闭的。
		比如<em> br/</em> 元素就是没有关闭标签的<big>空元素</big>。在开始标签中添加/是关闭空元素的正确方法</p>
	<p>body元素的内容会显示在浏览器中。
		<br/>tittle 元素的内容会显示在浏览器的标识栏中</p>
	<p>br元素能够实现换行效果。
		<br />举个例子，在段落元素中实现折行效果</p>
	<img src="../img/710997360df69443f11ab7dbd4683723.jpg"/ width="50%" ><br />
	<button><a href="练习2.html"><strong><em>此处进入链接</em></strong></a></button>
	<pre>这是预格式文本。它保留了空格     和换行！
		例如：
	 for(i=10;i<12;i++ )
	 	printf("hello world!");
    </pre>
    <code>
    	for(i=10;i<12;i++ )
	 	  printf("hello world!");
	 	 <!--<code>标签</code>用于显示计算机代码-->
    </code>
    <address>中国</address>
    <abbr title="the Pople's Republic of China">PRC</abbr>
    <br/>
    这是长的引用：
    <blockquote>
      床前明月光，<br/>疑是地上霜。<br/>举头望明月，<br/>低头思故乡。
 </blockquote>

      这是短的引用：
    <q>
      人生而自由！
    </q>
	</body>
</html>

段落元素 段落的大小依赖于浏览器窗口的大小（与源代码中划分行数的多少无关），如果调节浏览器窗口的大小，将改变段落中的行数。

浏览器忽略源代码中的排版，会省略多余的空格和换行。

折行元素  很简单，实现换行效果

标题元素<h1~h6> 标题标签用于标题文本。h1到h6字体依次减小，

图片元素 <img></img> HTML 图像是通过 <img> 标签进行定义的，图像的名称和尺寸是以属性的形式提供的。

超链接元素<a></a> HTML 链接是通过 <a> 标签进行定义的。可以实现网页的跳转。

带语义的加粗

带语义的倾斜

加粗

倾斜

预格式文本标签<pre></pre> 保留了源代码中的空格和换行。

地址标签<address></address>