如何制作html网页网页设计制作网站模板

编程之家2026-05-22976次浏览

各位老铁们，大家好，今天由我来为大家分享如何制作html网页，以及网页设计制作网站模板的相关问题知识，希望对大家有所帮助。如果可以帮助到大家，还望关注收藏下本站，您的支持是我们最大的动力，谢谢大家了哈，下面我们开始吧！

如何用html制作一个网页

1，打开记事本，并在其中输入必要信息，完整代码如下：

<!DOCTYPE html><html><head><meta charset="utf-8"><title></title>

<body><header><img src="molihua.jpg"width="412" height="291"</header><article><header><h2>茉莉花</h2><p>作者：宋·刘克庄</p></header><hr/><p>曾与瑶姬约。恍相逢、翠裳摇曳，珠韝联络。风露青冥非人世，揽结玉龙骖鹤。

爱万朵、千条纤弱。

祷祝花神怜惜取，问开时、晴雨须斟酌。枝上雪，莫消却。

恼人匹似中狂药。

凭危栏、烛光交映，乐声遥作。身上春衫香薰透，看到参横月落。

算茉莉、犹低一著。坐有缑山王郎子，倚玉箫、度曲难为酢。君不饮，铸成错。</p><h3>清平乐</h3><p>冰轮万里。云卷天如洗。先向海山生大士。却诞卯金之子。冰盆荔子堪尝。胆瓶茉莉尤香。震旦人人炎热，补陀夜夜清凉。</p><dl><dt>《浣溪沙》</dt><dd>南国幽花比并香。直从初夏到秋凉</dd><dt>《鹧鸪天》</dt><dd>携靓侣，泛轻航。棹歌惊起野鸳鸯</dd><dt>《真珠帘》</dt><dd>茉莉芰荷香，拍满笙箫院。</dd>

</dl></article><footer>2019.9.6</footer></body></html>

启动浏览器运行后，大家会发现界面并不美观，文字看着也比较乱。

为了解决这个问题，可以在界面添加css规则，让界面更好看，更标准化，将下面的代码块添加到记事本中，位置在<head>和<head/>也就是头部之间：

再次保存和预览，是不是看着美观多了

如何用HTML5制作网页

现在以HBuilder工具编写为例：

1.打开此工具，在项目管理器中右键单击创建一个web项目

2.右键单击项目名称，新建一个HTML文件----form01.html

<!DOCTYPE html>

<!--

作者：offline

时间：2017-01-06

form表单

在form标签中，有两个经常使用的属性

action：表单提交服务器地址

method:表单提交的方法/方式----get/post

其他提交方式---put delete

提交方式----get（默认的提交方式）

1.请求的参数放到地址栏中

2.不安全

3.存在缓存

4.传输数据的大小收到限制

提交方式----post

1.请求的参数放到http协议中

2.相对安全---账号密码等信息不会放到地址栏中

3.没有缓存

4.传输数据的大小限制较小

修改成post之后，可能会出现错误信息。

input标签：定义输入字段，用户可在其中输入数据。

属性：

type指示 input标签的类型，默认的是text

按钮类型：普通按钮 button重置按钮 Reset提交按钮 submit

value定义要显示的文本。

-->

<html>

<head>

<title>form表单1</title>

</head>

<body>

</form>

</body>

</html>

3.查看此网页是不是HTML5，主要看表头

4.HTML5新增了很多新内容，具体可以查看API，例如：在网页中嵌套音频/视频文件的格式

怎样制作html网页

怎样制作html网页?制作网页的整体思路有：

在进行网页制作的时候，要明白网页的类型以及所需要的材料，并做好一个框架构想，这样利于网页的效果形成，对后期的建设有相应的链接作用和奠基作用。

先布局，再用CSS进行控制。

骨架搭好了，初始化样式。

注意：将CSS的样式导入到外部样式表时，要注意图片的位置，以及对外部样式表的引入。这点可以参照HTML文件和LING&MAODIANSHANG等

1、头部的背景图片的高度128px来自素材的图片高，容器的宽度大小也来自图片宽

2、图片的位置：当你在编写index.html页面代码时，出现一些图片路径时，那么先分清楚哪些是同级目录文件