html案例图片

最新推荐文章于 2023-10-12 11:11:21 发布

weixin_46396624

最新推荐文章于 2023-10-12 11:11:21 发布

阅读量573

点赞数

文章标签： html

本文链接：https://blog.csdn.net/weixin_46396624/article/details/104568961

版权

本文详细介绍了29个HTML实际应用案例，包括各种类型和应用场景，旨在帮助读者深入理解和掌握HTML在网页设计中的运用。

摘要由CSDN通过智能技术生成

案例1

<html>
	<head>
		<title>第一个HTML文件</title>
		<meta charset="utf-8">
	</head>
	<body>
		欢迎学习HTML
	</body>
</html>

在这里插入图片描述

案例2

<html>
	<head>
		<title>HTML，学习</title>
		<meta charset = "utf-8">
	</head>
	<body>
		welcome to  html ！
	</body>
</html>

在这里插入图片描述

案例3

<html>
	<head>
		<title>HTML学习</title>
	</head>
	<body>
		欢迎学习HTML网页技术！
	</body>
</html>

在这里插入图片描述

案例4

<html>
 <head>
  <title>标签的组成</title>
  <meta charset="utf-8">
 </head>
 <body bgcolor = "yellow" text="red">
  标签的组成
  <hr>
  HTML从入门到精通
  <hr>

  <h2>二级标题</h2>

  <h1>哈哈</h1>呵呵
  <hr>

  <span>嘿嘿</span>吼吼
  
 </body>
</html>

在这里插入图片描述

案例5

<!DOCTYPE html>
<html long="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<!--这是我们的第一个HTML注释-->
	图书:&lt;&lt;html从入门到精通&gt;&gt;
	<hr>

	北京&nbsp;&nbsp;&nbsp;&nbsp;上海&nbsp;&nbsp;&nbsp;&nbsp;广州
	<hr>

	在HTML中用&amp;It;表示<小于号
	<hr>

	"html语言"或者  &quot;html语言&quot;
	<hr>
	版权所有  &copy;2000-2020 高教培训
	<hr>

	&reg;
	&times;关闭字符
	&aMp;实体字符名称严格区分大小写，即大小写敏感
</body>
</html>

在这里插入图片描述

案例6

<!DOCTYPE html>
<html lang ="en">
<head>
    <<meta charset="utf-8">
	<title>Document</title>
</head>
<body>
	<pre>
		html从入门到精通
		主讲：hector
	</pre>
	<hr>

	<div style="width:400px;height:100px;background:red">导航部分</div>
	<div style="width:400px;height:500px;background:yellow">正文部分</div>
	<div style="width:400px;height:100px;background:blue">版权部分</div>
	<hr>

	iphone XR,不要8888,不要1888，只要<span style="font-size:50px;color:red">98元</span>
</body>
</html>