HTML-h、p、a、img标签小试

最新推荐文章于 2024-06-06 12:13:29 发布

grace666

最新推荐文章于 2024-06-06 12:13:29 发布

阅读量3.2k

点赞数 1

分类专栏： Html

本文链接：https://blog.csdn.net/grace666/article/details/51824310

版权

Html 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

1.HTML标题（Heading）

（1）通过<h1> - <h6>等标签进行定义的

示例代码如下：

<span style="font-family:Microsoft YaHei;"><html>
<body>
	<!--h标签，标题-->
	<h1>My First Heading</h1>
	<h1>This is heading-1</h1>
	<h2>This is heading-2</h2>
	<h3>This is heading-3</h3>
	<h6>This is heading-6</h6>
	<h7>My 7 Headings</h7>
	<h11>My di 11 Headings</h11>

</body>
</html></span>

效果图：

2.HTML段落

（1）通过<p>标签进行定义

示例代码：

<span style="font-family:Microsoft YaHei;"><html>
<body>
	
	<!--p标签，段落-->
	<p>My first paragraph.</p>
	<p>This is 1 paragraph.</p>
	<p>This is 2 paragraph.</p> 

	
</body>
</html></span>

效果图：

3.HTML链接

（1）通过<a>标签进行定义

（2）在href属性中，指定链接地址

示例代码：

<span style="font-family:Microsoft YaHei;"><html>
<body>
	<!--a标签，链接-->
	<a href = "http://www.baidu.com">This is 1 link.</a>
	<p><a href="http://www.sina.com">This is 2 link.</a></p>
</body>
</html></span>

展现效果：

4.HTML图像

（1）通过<img>标签进行定义

（2）在src属性中指定图像名称

（3）width属性指定图像的宽度

（4）height属性指定图像的高度

示例代码：

<span style="font-family:Microsoft YaHei;"><html>
<body>
	
	<!--img标签，图像-->
	<img src="testimg1.jpg" width="104" height="142">This is a pic.</img>
	<img src="testimg2.jpg" width="104" height="142"/>
	<a href="http://www.taobao.com"><img src="testimg1.jpg" width="104" height="142"/></a>

</body>
</html></span>

效果：

其中最后一张图片，点击会进入淘宝网页

grace666

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
HTML-h、p、a、img标签小试

1.HTML标题（Heading）（1）通过 - 等标签进行定义的示例代码如下： My First Heading This is heading-1 This is heading-2 This is heading-3 This is heading-6 My 7 Headings My di 11 Headings效果图：2.HTML
复制链接

扫一扫