网站建设实战之---HTML：

最新推荐文章于 2024-10-09 02:20:01 发布

原创最新推荐文章于 2024-10-09 02:20:01 发布 · 806 阅读

0 ·

CC 4.0 BY-SA版权

网站建设实战专栏收录该内容

1 篇文章

订阅专栏

本文介绍了使用HTML进行基本网页制作的方法，包括如何设置标题、段落、链接等元素，并展示了如何利用不同标签实现文本格式化。

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

首先说明我用的是腾讯云服务器；配置和本地的服务器几乎一样。

我参考了： http://www.myhack58.com/Article/sort099/sort0100/2014/46295.htm

默认情况下网页是放在：

打开程序的路径是C:\inetpub\wwwroot当中。上面参考网页中也有；

今天我来看看第一个程序：

本程序参考：http://www.runoob.com/html/html-tutorial.html

我用的sublime编辑器：

第一个程序，注意格式清晰可以更清晰易读：

<!--下面这个给浏览器提示，这这个文件类型是html-->
<!DOCTYPE html>
<html>
<span style="white-space:pre">	</span><head>
<span style="white-space:pre">		</span><!--首先设定编码格式,这是注释格式！-->
<span style="white-space:pre">		</span><meta charset="utf-8"> 
<span style="white-space:pre">		</span><!-- 下面的是显示在页面×的左面的-->
<span style="white-space:pre">		</span><title>shawnchow</title>
<span style="white-space:pre">	</span></head>


<span style="white-space:pre">	</span><body>
<span style="white-space:pre">		</span><h1>这是第一个标题 </h1>
<span style="white-space:pre">		</span><p> 这是第一个段落 </p>
<span style="white-space:pre">	</span></body>
</html>

运行结果：

HTML 链接是通过标签 <a> 来定义的：

<a href="http://www.runoob.com">这是一个链接</a>

HTML 图像是通过标签 <img> 来定义的.

<img src="w3cschool.png" width="104" height="142">

<br> 就是没有关闭标签的空元素（<br> 标签定义换行）。

	<body>
		<h1>这是第一个标题 </h1>
		<p>
			<br> 这是第一个段落 </br>
			<br> 本段有两行</br>
		</p>
	</body>

应该将 h1 用作主标题（最重要的），其后是 h2（次重要的），再其次是 h3，以此类推

<span style="white-space:pre">		</span><h1>这是第一层标题 </h1>
		<h2>这是第二层标题 </h2>
		<h3>这是第三层 </h3>

效果如下：

<hr> 标签在 HTML 页面中创建水平线。在这个地方画一条贯穿的横线；

<hr></hr>

br也可以这么用作换行；

<p>This is<br>a para<br>graph with line breaks</p>

对字体的设置：

参考：http://www.runoob.com/html/html-formatting.html

<html>
<body>

<b>加粗文本</b><br><br>
<i>斜体文本</i><br><br>
<code>电脑自动输出</code><br><br>
这是 <sub> 下标</sub> 和 <sup> 上标</sup>

</body>
</html>

超链接：

参考：http://www.runoob.com/html/html-links.html

<a href="http://www.runoob.com/" target="_blank">访问菜鸟教程!</a>

<p>如果你将 target 属性设置为 "_blank", 链接将在新窗口打开。</p>

这些需要不断实践；不好写，就写到这里了！