如何制作HTML页面 如何制作HTML文件?

作者&投稿:柏广 (若有异议请与网页底部的电邮联系)

1、首先我们需要在桌面上,新建一张记事本

2、然后我们需要打开记事本,编写代码

3、然后我们需要把记事本修改后缀名为.html

4、然后我们需要在桌面上就会有一张网页,这一点很重要。

5、最后我们需要需要在浏览器上运行该网页



HTML介绍:(1):<html>
<head>
<title>Title of page</title>
</head>
<body>
This is my first homepage.
<b>This text is bold</b>
</body>
</html> 将此文件保存为“mypage.htm”。启动浏览器。在文件菜单中选择“打开”(或者“打开页面”),这时将出现一个对话框。选择“浏览”(或者“选择文件”),定位到你刚才创建的HTML文件——“mypage.htm”,选择它,单击“打开”。然后在对话框中,你将看到这个文件的地址,比如说:“C:\MyDocuments\mypage.htm”。单击“确定”,浏览器将显示此页面。
--------------------------------------------------------------------------------例子解释HTML文档中,第一个标签是<html>。这个标签告诉浏览器这是HTML文档的开始。HTML文档的最后一个标签是</html>,这个标签告诉浏览器这是HTML文档的终止。在<head>和</head>标签之间文本的是头信息。在浏览器窗口中,头信息是不被显示的。在<title>和</title>标签之间的文本是文档标题,它被显示在浏览器窗口的标题栏。在<body>和</body>标签之间的文本是正文,会被显示在浏览器中。在<b>和</b>标签之间的文本会以加粗字体显示。
---常见问题问:我编写完了HTML文件,但是不能在浏览器中看见结果,为什么?
答:请确认你保存了文件,并且使用了正确的文件名和扩展名,例如:“c:\mypage.htm”,并且确认你用浏览器打开时使用同样的文件名。问:我编辑了HTML文件,但是修改结果并没有在浏览器中显示,为什么?
答:浏览器缓存了你的页面,所以它不需要两次读取同样的页面。你修改了这个页面,浏览器并不知道。请使用“刷新/重载”按钮来强迫浏览器读取编辑过的页面。
-----------------------------------------------------------------------------
HTML基本标签:(2):HTML中最重要的标签是定义标题元素,段落和换行的标签。
标题元素标题元素由标签<h1>到<h6>定义。<h1>定义了最大的标题元素,<h6>定义了最小的。
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>
<h4>This is a heading</h4>
<h5>This is a heading</h5>
<h6>This is a heading</h6>
HTML自动在一个标题元素前后各添加一个空行。
(3):段落段落是用<p>标签定义的。
<p>This is another paragraph</p> HTML自动在一个段落前后各添加一个空行。
--------------------------------------------------------------------------------换行当需要结束一行,并且不想开始新段落时,使用<br>标签。<br>标签不管放在什么位置,都能够强制换行。
<p>This <br> is a para<br>graph with line breaks</p> <br>标签是一个空标签,它没有结束标记。
基本注意点——有用的技巧当你写下HTML文本的时候,你不能确知在另外一个浏览器中,这些文本将被如何显示。有人用着大的显示器,有的人用的小一些。每次用户调整窗口大小的时候,文本都将被重新格式化。不要想在编辑器中写一些空行和空格来协助排版。HTML将截掉你文本中的多余空格。不管多少个空格,处理起来只当一个。一点附加信息:在HTML里面,一个空行也只被当作一个空格来处理。使用空段落<p>来插入空白行是一个坏习惯,请使用<br>标签来替代。(但是不要用<br>标签来创建列表,我们后面会专门学习HTML列表的。)你也许注意到了段落可以不写结束标记</p>。别依赖它,HTML的下一个版本将不准你漏掉任何一个结束标签。HTML自动在某些元素前后增加额外的空行,就像在段落和标题元素的前后一样。我们使用了水平线(<hr>标签)来分隔我们教程的章节。
更多示例:a:多个段落:
<html>
<body>
<p>
This paragraph
contains a lot of lines
in the source code,
but the browser
ignores it.
</p>
<p>
This paragraph
contains a lot of spaces
in the source code,
but the browser
ignores it.
</p>
<p>
The number of lines in a paragraph depends on the size of your browser window. If you resize the browser window, the number of lines in this paragraph will change.
</p>
</body>
</html>
(这个例子说明了段落的一些默认行为。)b:换行:

<html>
<body>
<p>
To break<br>lines<br>in a<br>paragraph,<br>use the br tag.
</p>
</body>
</html>
(这个例子说明了在HTML文档中换行的使用。)

c:诗歌的问题: <html>
<body>
<p>
My Bonnie lies over the ocean.
My Bonnie lies over the sea.
My Bonnie lies over the ocean.
Oh, bring back my Bonnie to me.
</p>
<p>Note that your browser simply ignores your formatting!</p>
</body>
</html>
(这个例子说明了HTML显示格式的一些问题。)d:标题元素: <html>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
<p>Use heading tags only for headings. Don't use them just to make something bold. Use other tags for that.</p>
</body>
</html>
(这个例子说明了在HTML中显示标题元素的标签。)e:居中的标题元素:<html>
<body>
<h1 align="center">This is heading 1</h1>
<p>The heading above is aligned to the center of this page. The heading above is aligned to the center of this page. The heading above is aligned to the center of this page.</p>
</body>
</html>
(这个例子显示了一个居中的标题元素。)f:水平线:<html>
<body>
<p>The hr tag defines a horizontal rule:</p>
<hr>
<p>This is a paragraph</p>
<hr>
<p>This is a paragraph</p>
<hr>
<p>This is a paragraph</p>
</body>
</html>
(这个例子说明了如何插入水平线。)
g:隐藏的注释:<html>
<body>
<!--This comment will not be displayed-->
<p>This is a regular paragraph</p>
</body>
</html>
(这个例子说明了在HTML文档中如何插入隐藏的注释。)h:背景色:<html>
<body bgcolor="yellow">
<h2>Look: Colored Background!</h2>
</body>
</html>
(这个例子说明了如何给页面设置背景色。)

网页主要由HTML构成,而HTML只是简单的纯文本格式,如果你机子上用的是WINDOWS那么便可以用它自带的记事本打开就可以做网页了,在网上你可以把一些你用的必要的代码复制下来,不过你最好懂的HTML,便会用的得心应手了,但如果你是新手的话
学网页制作先要从最基本的开始,你会用微软的WORD吗?如果会的话就好办了,那么我建议你用微软的FRONTPAGE,和WORD一样的用法,是一个业余网页制作者用来得心应手的软件,只是板面问题是用隐藏的表格来布局的,这一点对新手来说很重要,
你在此必须学会的是其中的HTML语言,这种语言很简单,都是以<body>这样的形式开头</body>这样的形式结束,
此外你可以学一下用FLASH,和PHOTOSHOP学会做一些简单的图片,这样想表达什么会容易一些,
如果你学会了HTML语言,一切就变的容易一些,你可以用HOTDOG来做一些专业的网页,这样你便学会了制作静态网页,可以上传到一些免费的空间,一般非专业人员这样就足够了。
下来便是最好学一下网页三剑客中的DREAMWEAVER,其中要学的是CSS,学会用它做一些简单的ASP交互式互动网页,多卖一点专业的书,学会SQL关系数据库,和一些脚本语言,比如VBSCRIPT或JAVASCRIPT,这样你便成为一个动态网页的制作高手。另外到这时的你可以试着学一下微软的.NET。
或许我说的后边你有一些不明白,但是你只要学了,便会一步一步过度过来,祝你早日成为网络高手。
要弄好自己的主页还要注意网站的统一性、主色调和字体问题,如果你这方面是弱项,最好模枋一个网站的主风格或者干脆去网上找一个好的模板,来改动其中的内容,这样你便不是专业人氏也能做的很好。

制作HTML页面步骤如下:

1、HTML元素,HTML 元素以开始标签起始,以结束标签终止。没有内容的 HTML 元素被称为空元素。
2、TML标签,html中的常用标签分类。
3、做HTML图片和链接。
此阶段学习的HTML,虽然只是入门级别,但要写出一个好的网页,熟练掌握基础技术和知识是必不可少。HTML(Hypertext MarkupLanguage)也叫作超文本标记语言,是一种用来结构化 Web 网页及其内容的标记语言,标准通用标记语言下的一个应用,可以使用 HTML 来建立自己的 WEB 站点。HTML(标准通用语言下的一个应用)元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。HTML标签是HTML语言中最基本的单位,是【学习HTML的基础】。网页制作中大多数时候会插入图片或链接,这也是必学基础内容。

想了解更多HTML有关的详情,推荐咨询达内教育。达内教育已从事19年IT技术培训,累计培养100万学员,并且独创TTS8.0教学系统,1v1督学,跟踪式学习,有疑问随时和老师进行沟通;同时,其26大课程体系紧跟企业需求,企业级项目,课程穿插大厂真实项目讲解,对标企业人才标准,制定专业学习计划,囊括主流热点技术,助力学员提高自身竞争力。【感兴趣的话点击此处,免费学习一下】

有种最简单的方法,最多十分钟就搞定一页:一,用DW软件,打开-插入-表格-(这里您已经有了要作一个什么样网页的大致想法)几行,几列。宽度要在1000为好,这样下面就会出现一个导航条,边界设置为0。如:插入表格为1行3列-确定。在用鼠标点击第一空格,插入-图片,寻找您要插入图片的位置,确定(或保存),然后在用鼠标点击第二个空格,插入。。。。等。以此类推。然后再用鼠标点击您刚才插入表格的下沿。重复您刚才的动作——插入-表格。几行几列要根据您对页面的构思而定。如果要在空格里插入文章,一定要把文章的格式转换成纯Word文档,后缀为.doc

如何用HTML5制作网页~

现在以HBuilder工具编写为例:
1. 打开此工具,在项目管理器中右键单击创建一个web 项目

2.右键单击项目名称,新建一个HTML文件----form01.html
form表单1
3.查看此网页是不是HTML5,主要看表头

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

HTML文件制作方法如下:
一、打开简单的文本编辑器。大部分文本编辑软件都能编写HTML,不过,复杂的软件有自动格式功能,比较难组织HTML页面。

二、将文件格式改成“网页”(Web Page)、“.html”或“.htm”,存在容易找到的位置。上面三个选择是一样的,没有差别。

三、用网页浏览器打开文件,双击文件,它应该会自动在浏览器打开,但现在还只是个空白网页。

四、更新网页,查看已保存的更改。将Hello输入空白的文件。
更新浏览器上的空白网页,你应该可以看到网页上方有个加粗的“Hello”字眼。在本教程中,你随时可以测试新的HTML。只要保存.html文件,然后更新浏览器窗口,就能看到浏览器如何诠释HTML。

六、构建文档。删除HTML文档里的所有东西。这个HTML代码告诉浏览器你使用哪一版HTML,网页所有内容都在和标签之间。

七,添加head和body标签。HTML文档分为2个部分。“Head”部分是特别信息,例如网页标题。“Body”部分则包括网页内容。

扩展资料
一个网页对应多个HTML文件,超文本标记语言文件以.htm(磁盘操作系统DOS限制的外语缩写)为扩展名或.html(外语缩写)为扩展名。可以使用任何能够生成TXT类型源文件的文本编辑器来产生超文本标记语言文件,只用修改文件后缀即可。
标准的超文本标记语言文件都具有一个基本的整体结构,标记一般都是成对出现(部分标记除外例如:),即超文本标记语言文件的开头与结尾标志和超文本标记语言的头部与实体两大部分。有三个双标记符用于页面整体结构的确认。
标记符,说明该文件是用超文本标记语言(本标签的中文全称)来描述的,它是文件的开头;而,则表示该文件的结尾,它们是超文本标记语言文件的开始标记和结尾标记。
文本标记语言源程序的文件扩展名默认使用htm(磁盘操作系统DOS限制的外语缩写为扩展名)或html(外语缩写为扩展名),以便于操作系统或程序辨认,除自定义的汉字扩展名。在使用文本编辑器时,注意修改扩展名。而常用的图像文件的扩展名为gif和jpg。
超文本标记语言源程序为文本文件,其列宽可不受限制,即多个标记可写成一行,甚至整个文件可写成一行;若写成多行,浏览器一般忽略文件中的回车符(标记指定除外);对文件中的空格通常也不按源程序中的效果显示。
完整的空格可使用特殊符号(实体符)“ (注意此字母必须小写,方可空格)”表示非换行空格;表示文件路径时使用符号“/”分隔,文件名及路径描述可用双引号也可不用引号括起。
标记符中的标记元素用尖括号括起来,带斜杠的元素表示该标记说明结束;大多数标记符必须成对使用,以表示作用的起始和结束;标记元素忽略大小写,即其作用相同,但完整的空格可使用特殊符号“ (注意此字母必须小写,方可空格)”。
许多标记元素具有属性说明,可用参数对元素作进一步的限定,多个参数或属性项说明次序不限,其间用空格分隔即可;一个标记元素的内容可以写成多行,标记符号,包括尖括号、标记元素、属性项等必须使用半角的西文字符,而不能使用全角字符。
HTML注释由"“结束结束,例如。注释内容可插入文本中任何位置。任何标记若在其最前插入惊叹号,即被标识为注释,不予显示。
参考资料:百度百科--HTML

html海报网页制作-如何制作HTML页面
答:关于html页面制作 制作的网页: 整体思路: 先布局再CSS控制 骨架搭好了,初始化样式, 后再弄CSS样式。注意:将CSS的样式导入到外部样式表时,要注意图片的位置,以及 对外部样式表的引入 1、头部的背景图片的高度128px来自素材的图片高,容器的宽度大小也来自图片 的宽,那么这里背景图片设置的有意思吗?不设置效果一样...

如何用HTML创建一个简单网页
答:使用HTML 了解HTML是什么。HTML是一种制作网页的编码语言。想看看它是什么样子,访问IE并右键点击空白处选择“查看源文件”。你会看到一个代码页面,那就是HTML。浏览器可以理解这些代码,并把这些代码解释成Web页面。 在IE浏览器中,选择查看菜单中的“源”。在Mozilla Firefox中,按下[Ctrl]+U查看网页...

如何建立网页如何建立网页的模板
答:2.然后,创建您的第一个网页文件。为了便于管理,请创建一个文件夹来存储您的web文件和图片。右键单击您创建的文件夹,然后选择新建,文本文件。3.然后,将这个文件重命名为index,并将点号后的txt改为html。这样的网页文件就做好了。4.html是网页文件的扩展。扩展名用来区分文件的类型,扩展名也用来...

html5如何创建模板html模板怎么搭建
答:07然后在弹出的另存为界面中,选择HTML作为新的文件类型,如下图所示。08然后切换到顶部的编码菜单,点击编码模板,在下拉框中选择刚刚创建的模板,如下图所示。09最后,我们可以看到新创建的模板内容已经被快速插入到新创建的HTML页面中,如下图所示。h5网页制作软件?maka编辑器手机版是一款强大的模板...

一个完整的html代码怎么编写?
答:简单的htm的编写过程如下:先新建一个文本文件,可以自己命名,如下图,我命名为测试。编译文本,以最简单的代码格式为例<html> <head> <title> </title> </head> <body> </body></html> 在<body></body>写入你要写的内容,下面以hello world为例。修改文件后缀名,将txt改...

怎样用HTML制作网页
答:HTML可以说成是一种语言,可用它来描述网页。最简单的网站的可以用多个HTML文件来组成。文件之间加上链接,就可以从一个HTML文件打开另一个HTML文件。HTML文件可以直接用电脑的记事本打开编辑.无框架HTMLHTML文件,主要由三部分组成. 全文处在标识对HTML/HTML内; 文件头标识对head/head进行一些预处理; ...

个人网页怎么制作怎么建立个人网站
答:如何制作自己的网页 自己制作网页的具体方法如下:工具/原材料:Dreamweaver8.0。1.首先你要安装Dreamweaver软件,打开它启动它,然后点击创建一个html页面。2.设置表格中的行数和列数。3.单击“确定”以获得宽度为1000像素的表格。我们可以添加图片或文字作为bnner。4.在这里,让我们键入一行来演示。5.设置...

如何制作手机版html5如何制作手机版PPT
答:2.去html5页面制作平台,比如vxplo,wix,maka.im,就可以制作html5移动页面。但是,wix现在没有中文网站;Vxplo功能齐全,但同时操作非常复杂,一般人不会用。Maka.im是用模板组合,加上图文制作而成,适合初学者。HTML5如何转化APP?用hbuilder,是个IDE,新建移动应用,新建文件夹,把你的html页面放...

如何制作HTML文件?
答:HTML文件制作方法如下:一、打开简单的文本编辑器。大部分文本编辑软件都能编写HTML,不过,复杂的软件有自动格式功能,比较难组织HTML页面。二、将文件格式改成“网页”(Web Page)、“.html”或“.htm”,存在容易找到的位置。上面三个选择是一样的,没有差别。三、用网页浏览器打开文件,双击文件,...

学生html静态页面该如何做?(很容易哦)
答:对于刚开始学习网页开发的童鞋们来说,掌握了比较简单的HTML语言基础后,会迫不及待地想着手制作自己的第一个网页,然而DW等软件的安装却不尽人意。今天小编为饱受心灵摧残的童鞋们带来了福音,为大家讲解一下如何不用安装软件也能轻松建立一个HTML文件。(下图是成品)向左转|向右转 工具/原料 一台...