当前位置: 移动技术网 > IT编程>网页制作>HTML > Html 初识

Html 初识

2020年07月24日  | 移动技术网IT编程  | 我要评论

一 效果图

二 代码

<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<link rel="shortcut icon" href="D:/test2.png">    <!-- 地址栏左侧显示logo等图片-->
	<title>地址栏标题</title>

	<style type="text/css">
	a {color:blue}
	</style>
</head>

<body>												  <!-- 文档主体-->
	<h1>大标题1</h1>
	<font size="6">6号字体</font>
	<h2>大标题2</h2>
	<font size="5">5号字体</font>
	<p>段落<br>1</p>								   <!-- 换行的段落1-->
	<hr>                                               <!-- 水平线-->
	<p>段落2</p>
	<a href="https://www.baidu.com">百度网址</a>
	<br/>										       <!-- 换行 相当于<br>..</br>-->
	<img src="D:/test.png" width="25" height="39" />
	<br/>
	
	<a href="https://www.baidu.com">
	<img src="D:/test2.png" width="70" height="39" />
	</a>											    <!-- 将图片替换成文本-->
	
	<br/>

	<p>
	<a href="https://www.microsoft.com/">本文本</a>
	 万维网上页面链接。</p>
	<br/>
	
	<a href="https://www.runoob.com/" target="_blank">访问菜鸟教程!</a>
	<p>如果你将 target 属性设置为_blank, 链接将在新窗口打开。</p>
	
	<br/>
	<p>
	<a href="#C4">查看章节 4</a>                         <!-- 书签-->
	</p>

	<br/>
	<b>这个文本是加粗的</b>
	<br/>
	<strong>这个文本是加粗的</strong>
	<br/>
	<big>这个文本字体放大</big>
	<br/>
	<em>这个文本是斜体的</em>
	<br/>
	<i>这个文本是斜体的</i>
	<br/>
	<small>这个文本是缩小的</small>
	<br/>
	<p><bdo dir="rtl">该段落文字从右到左显示。</bdo></p>  
	<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>
	
	<br/>
	<h2><a id="C4">章节 4</a></h2>                       <!-- 书签-->
	<p>这边显示该章节的内容……</p>
	<br/>
	
	这个文本包含
	<sub>下标</sub>

	<br />

	这个文本包含
	<sup>上标</sup>

	<pre>
	此例演示如何使用 pre 标签
	对空行和    空格
	进行控制
	</pre>

	<p>WWF's goal is to:                                <!-- 块引用-->
	<q>Build a future where people live in harmony with nature.</q>
	We hope they succeed.</p>

</body>

</html>

 

本文地址:https://blog.csdn.net/ljwoainia/article/details/107543943

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网