网页设计html框架代码（html5网站框架怎么写）

本文目录

• html5网站框架怎么写
• 制作一个如下图所示的框架网页，写出HTML代码
• 写出HTML文件的基本框架结构代码
• 急求！！！网页设计 HTML代码大全
• 怎么用html制作简单得网页代码
• HTML基本框架怎么写
• html页面基本框架

html5网站框架怎么写

解决办法如下：

《!DOCTYPEhtml》

《html》

《head》

《metacharset="utf-8"/》

《title》HTML5ExamplesPage《/title》

《style》

《!--这里是CSS代码--》

《/style》

《/head》

《body》

《article》

《header》标题《/header》

《section》正文《/section》

《footer》文章相关信息《/footer》

《/article》

《script》

《!--这里是JavaScript代码--》

《/script》

《/body》

《/html》

应用须知

它可能会消灭Flash

许多业内人士表示，HTML将会最终代替多媒体框架，如Adobe的Flash，但是短期看来还不是时候。HTML5估计到2014年才能逐步成熟，而且将现有应用Flash的网络开发完全转向HTML5还需要一段时间。尽管HTML5提出了许多优点，但是还可能有某些应用更适合于更灵活的框架。一些主流的大公司都逐步转向使用HTML5，谷歌于2015年2月26日开始自动将Flash广告转换为HTML5格式，这可能会加速HTML5替代Flash的进程，但是这个转变的过程也不是一蹴而就的。

它新并不表示它安全

网络应用开发工程师们在学习新技术的同时需要时刻记住网络安全。HTML5所构建的网页和其他语言编写的网页一样容易泄露一些敏感数据。欧洲网络信息安全机构（EuropeanNetworkandInformationSecurityAgency，ENISA）已经警告说HTML5可能并不够安全。

它承诺带来一个无缝的网络

HTML5会带来一个统一的网络，无论是笔记本，台式机，还是智能手机都应该很方便的浏览基于HTML5的网站。因此在设计网站的时候，开发者需要重新考虑用户体验，网站浏览，网站结构等因素使得这个网站对任何硬件设备都通用。

它会变成企业的SaaS平台

一些重量级的企业，如微软，Salesforce，SAPSybase正在开发HTML5的开发工具。如果你正在构建企业应用，很可能不久的将来你就要用到HTML5。所以当构建公司的SaaS战略迁移的时候也不要忘记HTML5。

它将会变得很移动

几乎所有人都热衷于开发独立的移动应用，但是HTML5很可能会是独立移动应用的终结者。由于HTML5将应用的功能直接加入其内核，这很可能引导移动技术潮流重新回到浏览器时代。HTML5允许开发者在（移动）浏览器内开发应用，所以如果你正在制定一项桌面或者移动应用的长期发展策略，你可能需要考虑这一点。

制作一个如下图所示的框架网页，写出HTML代码

《style type=’text/css’》
#hifm{
width:1000px;
height:600px;
border:1px solid yellow;
float:left;
}
.head{
width:1000px;
height:80px;
border:1px solid yellow;
float:left;
}
.index{
width:160px;
height:455px;
border:1px solid yellow;
float:left;
}
.main{
width:836px;
height:455px;
border:1px solid yellow;
float:left;
}
.foot{
width:1000px;
height:60px;
border:1px solid yellow;
float:left;
}
《/style》
《div id=’hifm’》
《div class="head"》Head《/div》
《div class=’index’》Index《/div》《div class=’main’》Main《/div》
《div class=’foot’》Foot《/div》
《/div》

写出HTML文件的基本框架结构代码

《!DOCTYPE html》
《html》
《head lang="en"》
《meta charset="UTF-8"》
《meta http-equiv="X-UA-Compatible" content="IE=edge"》
《meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"》
《title》《/title》
《/head》
《body》
《/body》
《/html》

急求！！！网页设计 HTML代码大全

HTML标记_HTML大全_HTML标记大全_超文本标记语言
网页（WebPage）文件主要是用超文本标记语言（HyperText Markup Language，简称HTML）语句来写成。您可以通过IE浏览器的“查看”菜单中的“源文件”看到该页的HTML代码。HTML语言由一系列元素(element)组成，用于组织文件的内容和指导文件的输出格式。元素名称不分大小写。一个元素可以有多个属性，属性及其属性值不分大小写。属性名＝属性值合起来构成一个完整的属性，一个元素可以有多个属性，各个属性用空格分开。元素又由标记(tag)的构成，大多数标记是成对出现的，分起始标记《 》(start tag)和结尾标记《/ 》(end tag)，以便和页面的内容区分开来。其写成的文件是标准的ASCII文件，不同于一般的编程语言，故称为脚本（Script）更准确一点。其实也很简单，特别是在专门的HTML器的帮助下，您可以迅速地学会HTML，并能很快写出有自己特色的Homepage来。
需要说明的是：各种浏览器对html元素及其属性的解释不完全一样，如NC与IE是有区别的。
标 签 内 容备 注
基 本 标 签所有HTML文件都有的
《html》……《/html》表示文件类型为HTML文档
《head》……《/head》设置文档描述及其他不在WEB网页上显示的信息
《body》……《/body》HTML文档的主体（页面的实际内容）
标 题 标 签　
《title》……《/title》在标题栏中显示的题目（放在《head》《/head》内）
扩 展 属 性 标 签　
《base》
基址标签，为解决相对编址作参考值
《META》
将HTTP命令发给CONTENT=number;url允许，描述不包含在标准HTML里的文档信息。使用详解
《link》
提供将现行文档与其它文档或实体关联起来的信息
《ISINDEX》指明在服务器上提供文档的可以检索的索引
《style》……《/style》允许包含样式表（CSS）信息
页 面 属 性 标 签《body》……《/body》标签的扩展属性。使用详解
《body bgcolor=#……》设置背景颜色，用名字或十六进制值
《body text=#……》设置文本文字颜色，用名字或十六进制值
《body link=#……》设置链接颜色，用名字或十六进制值
《body vlink=#……》设置已使用的链接的颜色，用名字或十六进制值
《body alink=#……》设置正在被击中链接的颜色，用名字或十六进制值
文 本 标 签　
《pre》……《/pre》创建预格式化文本
《h1》……《/h1》创建最大的标题
《h6》……《/h6》创建最小的标题
《b》……《/b》创建黑体字
《i》……《/i》创建斜体字
《tt》……《/tt》创建打字机风格的字体
《cite》……《/cite》创建一个引用，通常是斜体
《em》……《/em》加重（通常是斜体加黑体）
《strong》……《/strong》强调（通常是斜体加黑体）
《font size=value》《/font》设置字体大小，从1到7
《font color=……》《/font》设置字体的颜色，使用名字或十六进制值
链 接　
《a href="/URL"》《/a》创建一个超链接
《a href="mailto:EMAIL"》 《/a》创建一个自动发送电子邮件的链接
《a name="NAME"》《/a》创建一个位于文档内部的靶位
《a href="#NAME"》《/a》创建一个指向位于文档内部靶位的链接
格 式 排 版　
《p》创建一个新的段落
《p align=……》将段落按左、中、右对齐
《br》插入一个回车换行符
《blockquote》……《/blockquote》 从两边缩进文本
《dl》……《/dl》创建一个定义列表
《dt》放在每个定义术语词之前
《dd》放在每个定义之前
《ol》……《/ol》创建一个标有数字的列表
《li》放在每个数字列表项之前，并加上一个数字
《ul》……《/ul》创建一个标有圆点的列表
《li》放在每个圆点列表项之前，并加上一个圆点
《div align=……》一个用来排版大块HTML段落的标签，也用于格式化表
图 形 元 素　
《img src="/name"》添加一个图像
《img src="/name" align=value》排列对齐一个图像：左中右或上中下
《img src="/name" border=value》设置围绕一个图像的边框的大小
《hr》加入一条水平线
《hr size=value》设置水平线的大小（高度）
《hr width=value》设置水平线的宽度（百分比或绝对像素点）
《hr noshade》创建一个没有阴影的水平线
表 格　
《table》……《/table》创建一个表格
《tr》……《/tr》开始表格中的每一行
《td》……《/td》开始一行中的每一个格子
《th》……《/th》设置表格头：一个通常使用黑体居中文字的格子
表 格 属 性　
《table border=value》设置围绕表格的边框的宽度
《table cellspacing=value》设置表格格子之间空间的大小
《table cellpadding=value》设置表格格子边框与其内部内容之间空间的大小
《table width=value 或 %》设置表格的宽度－用绝对像素值或文档总宽度的百分比
《tr align=……》设置表格格子的水平对齐（左中右）
《tr valign=……》设置表格格子的垂直对齐（上中下）
《td colspan=value》设置一个表格格子应跨占的列数（缺省为1）
《td rowspan=value》设置一个表格格子应跨占的行数（缺省为1）
《td nowrap》禁止表格格子内的内容自动断行回卷
窗 框　
《frameset》……《/frameset》放在一个窗框文档的《body》标签之前，也可以嵌在其他窗框文档中
《frameset rows="value,value"》定义一个窗框内的行数，可以使用绝对像素值或高度的百分比
《frameset cols="value,value"》定义一个窗框内的列数，可以使用绝对像素值或宽度的百分比
《frame》定义一个窗框内的单一窗或窗区域
《noframes》……《/noframes》定义在不支持窗框的浏览器中显示什么提示
窗 框 属 性　
《frame src="/URL"》规定窗框内显示什么HTML文档
《frame name="name"》命名窗框或区域以便别的窗框可以指向它
《frame marginwidth=value》定义窗框左右边缘的空白大小，必须大于等于1
《frame marginheight=value》定义窗框上下边缘的空白大小，必须大于等于1
《frame scrolling=value》设置窗框是否有滚动栏，其值可以是"yes","no","auto"，缺省时一般为"auto"
《frame noresize》禁止用户调整一个窗框的大小
表 单对于功能性的表单，一般需要运行一个CGI小程序，HTML仅仅是产生表单的表面样子。
《form》……《/form》创建所有表单
《select multiple name="NAME" size=value》………《/select》创建一个滚动菜单，size设置在需要滚动前可以看到的表单项数目
《option》设置每个表单项的内容
《select name="NAME"》……《/select》创建一个下拉菜单
《textarea name="NAME" cols=value rows=value》……《/textarea》创建一个文本框区域，列的数目设置宽度，行的数目设置高度
《input type="checkbox" name="NAME"》创建一个复选框，文字在标签后面
《input type="radio" name="NAME" value="x"》创建一个单选框，文字在标签后面
《input type=text name="……" size=value》创建一个单行文本输入区域，size设置以字符计的宽度
《input type="submit" value="NAME"》创建一个submit（提交）按钮
《input type="image" border=0 name="NAME" src="/name.gif"》创建一个使用图象的submit（提交）按钮
《input type="reset"》创建一个reset（重置）按钮
附 加 属 性　
《PRE》……《/PRE》预置格式风格标签用来显示字体宽度固定的文本块，主要用来在表格格式中显示文本
《TT》……《/TT》打字机风格用来显示打字机字体宽度固定的文本
《SAMP》……《/SAMP》示例风格以单倍距显示文本
《ADDRESS》……《/ADDRESS》地址风格一般用于文档的开始或结尾处，并以斜体格式显示文本。
《DL》……《/DL》定义列表风格用来显示术语及其定义
　　
颜色
#=rrggbb 16 进制 RGB 数值，或者是下列预定义色彩：
Black,Olive,Teal,Red,Blue,Maroon,Navy, Gray,Lime,Yellow,white,Silver,Fuchsia,Purple,Green,Aqua
META标签
描述不包含在标准HTML里的文档信息。
《META NAME="keywords" CONTENT="yourkeyword"》
《META NAME="description" CONTENT="your homepage’s description"》
本页的关键字和描述。在页面里加上这些定义后，一些搜索引擎就能够让读者根据这些关键字搜索到您的主页，了解你的主页内容。
《META HTTP-EQUIV="refresh" CONTENT="30, URL=new.htm"》
浏览器将在30秒后，自动转到new.htm。您可用它制作一个封面，在若干时间后，自动带读者来到您的目录页。如果URL项没有，浏览器就是刷新本页。这就是WWW聊天室定期刷新的实现原理。
《meta

怎么用html制作简单得网页代码

用html制作简单的网页的步骤：

1、整体形象设计：企业确定要搭建网站，那么首先就需要确定企业的整体形象，这个形象包括企业的logo设计，整个站点的色彩搭配，网页流程设计，版面设计，甚至包括哪些地方本使用动态效果，哪些地方搭配文字信息，又或者需要布局哪些模块等等，这个都需要纳入到整体形象设计当中。

2、页面风格设计：网站整体设计完成之后，需要落实到每个小的页面，每个页面风格设计可以不同，但大的方向却需要一致，这样才能保证整个站点是整洁有序的，千万不能是一个页面一个页面设计，这样让用户感觉到非常突兀，甚至会不适应。

3、代码设计：代码设计其实也就是功能设计，一个网站不可能只是展示，还需要有一些其他功能，最少有联系版块的功能，留言功能等等，如果是电子商务网站还需要一些支付功能等等。此外，代码设计也涵盖了整个网站的框架布局，这个需要站长结合SEO优化元素去设计。

网页的本质就是超级文本标记语言，通过结合使用其他的Web技术（如：脚本语言、公共网关接口、组件等），可以创造出功能强大的网页。因而，超级文本标记语言是万维网（Web）编程的基础，也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言，是因为文本中包含了所谓“超级链接”点。

HTML基本框架怎么写

框架可以生成独立变化和滚动的窗口，从而能将一个窗口分割为若干个字窗口。在每一个字窗口中显示一个HTML文档。我们这回就来看看多文档的基本结构和子窗口之间的交叉链接。
一，基本结构HTML使用《Frameset》,《Frame》和《noFrames》标签来定义框架。下面我们就来了解一下这三个标签的作用和相应的属性。
（一），《Frameset》标签。
该标签是框架设计标签，成对使用。首尾标签之间的内容就是使用到框架的HTML主体部分。在使用框架的HTML文档中不能出现《body》标签，否则会导致浏览器忽略所有的框定义而只显示《body》和《/body》之间的内容。
《Frameset》标签作用是将窗口分割为若干个自窗口，子窗口的数目取决于嵌套在该标签中《Frame》标签的书目。《Frameset》标签有两个属性。rows和cols，分别用来确定个子窗口的高度和宽度，格式为《Frameset rows="值1,值2,……值n"》;《Framest cols="值1,值2,……值n"》.各参数之间以逗号分割，依次表示各个自窗口的高度（宽度）。这两个属性的参数值可以是数字、百分数或符号“*”。下面我们来分别解释一下：
（1）数字。表示子窗口高度（宽度）所占的像素点数。
（2）百分数。表示子窗口高度（宽度）占整个浏览器窗口高度（宽度）的百分比。 （3）符号“*”。当符号*只出现一次。即其他子窗口的大小都有明确的定义时，表示该子窗口的大小将根据浏览器窗口的大小而自动调整。当符号*出现一次以上时，表示按比例分割浏览器窗口的剩余空间。例如：
《Frameset cols="40%,2*,*"》表示将浏览器窗口分割为3列，第一个子窗口在第一列，窗口宽度为整个浏览器窗口宽度的40%；第二个子窗口在第二列，占浏览器窗口剩余空间的2/3，即其宽度为整个浏览器窗口宽度的40%，第三个子窗口占剩余空间的1/3，宽度为整个浏览浏览器窗口宽度的20%。
（二），《frame》标签。HTML用《frame》标签来标识子窗口。《frame》标签是嵌套在框架设置标签《Frameset》标签中来使用的单独标签。在《Frameset》中定义了多少个子窗口就要有多少个《frame》标签与之匹配，依次定义各个窗口的性质。《frame》标签有7个属性，除SRC属性是不可缺省的外，其他属性都是可选的。
（1）SRC属性。用以定义子窗口的名称。
（2）.name属性。用于定义子窗口的名称。
（3）frameboder属性。该属性的参数值为1或0。当参数值为1时，表示该子窗口有边框，为0时没有边框。该属性缺省值为1。
（4）bordercolor属性。用以规定子窗口的边框颜色。如果在一个以上的《frame》标签中定义了子窗口的边框颜色，则以第一次指定的颜色为标准。在指定边框颜色时，可以使用颜色的RBG代码或直接使用与该颜色想对应的英文单词。bordercolor属性的参数值可以是16种颜色中的任意一种。
（5）sclling属性。属性的参数值为yes,no或auto之一。参数值为yes时表示该子窗口始终有滚动条。为no时是始终没有滚动条。为auto时表示当文档的内容超出窗口范围时，浏览器自动为该子窗口添加滚动条。scolling属性的缺省值为auto.
（6）maginwidth和marginwidht属性。这两个属性是用来指定显示内容与窗口边界之间的空白距离大小的。其中maginwidth属性用于确定显示内容与左右边界之间的距离；maginwidht用来确定显示内容与上下边界之间的距离。这两个属性的参数值都是数字。分别表示左右边距所占的像素点数。
（三），《noframes》标签。使用该标签可以在用户浏览器不支持框架显示时告之用户一些相关信息，以免浏览者对空白窗口画面感觉莫名其妙。《noframes》标签是成对使用的。首尾标签之间的内容就上告之浏览者的信息。如“如您看到空白的画面说明您的浏览不支持框架显示”。虽然常用的两中浏览器IE和NC都是支持框架显示的。但为了加强文档的适用性，我们最好还是养成使用这个标签的习惯。
（四），基本结构。
我们举例说明HTML中框架文档的基本结构：
《html》
《head》
《title》文档标题《/title》
《/head》
《Frameset Cols="值1,值2,……,值n》将浏览器窗口分割为n个窗口。
《Frame SRC="1.html"》
《frame SRC="2.html"》
.
.
.
《frame SRC="n.html"》
《/Frameset》
《noframes》如果您看到空白的画面，说明您的浏览器是不支持框架机构的《/noframes》
《/html》
其中，《frameset》标签是可以嵌套使用的，也就是说，可以将其中某一个或几个子窗口划分为若干个更小的窗口。例如：
《html》
《Frameset cols="30%,90,*"》
《frame SRC="1.html"name=cont》
《frame SRC="caipage.gif"》
《frame SRC="2.html"》
《/frameset》
《frame SRC="f2.html"name=another marginheight=120》
《/frameset》
《noframes》您使用的浏览器不支持框架《/noframes》
《/html》
二，目标窗口的交叉链接。
为了方便用户进行搜索和浏览，我们经常用到一系列锚标组成的索引目录显示在一个子窗口中，而将锚标所指向的内容放在另一个子窗口中。显示锚标的子窗口通常被成为”源窗口“，显示目标文档的窗口则称之为“目标窗口”。
在进行交叉《frame》标签的name属性定义目标窗口的名称，然后再修改显示在源窗口中的文档。在所有的《A》标签中添加语句target="目标窗口名称"来指定目标文档的显示位置。例如：/P》连接时，我们必须先用
《html》
《head》
《title》目标窗口测试页《/title》
《/head》
《frameset cols="30%,90,*"》
《frame src=’f1.html"marginheight=60》
《frameset rows="120,*"》
《frame src="caipage.gif"》
《frame src="2.html"》
《/frameset》
《frame src="f2.html"name=another marginheight=60》
《/frameset》
《noframes》您的浏览器不支持框架结构《/noframes》
其中，第一个子窗口是源窗口。我们在源窗口的对应文档f1.html中定义了一系列锚标，该文档的内容如下：
《html》
《body》
《《center》（说明：文档主体内容举重显示
《P》《A href="田园风光.jpg" target="another"》田园风光《/A》《P》
《A href="qiu.jpg" target="another"》金色秋天《/A》《P》
《A href="tong.html" target="another"》渔哥唱晚《/A》《P》
《A href="pig.gif" target="another"》夕阳无限《/A》《P》
《/body》
《/html》
当用户点击锚标“田园风光”后，浏览器将在目标文档显示锚标的连接对象

html页面基本框架

基本认识：

（一）客户端与服务器端

客户端：浏览者（客户和管理员）使用的计算机。

服务器端：存放网页文件的计算机，发送脉冲、服务器解码所需的协议。

HTTP：一种协议。网址输入开头，网页传输所需。

（二）文件名，基本名，扩展名

文件名=基本名+扩展名

扩展名：用来区分文件类型。

》如文件名demo.txt：demo为基本名，txt为扩展名

（三）打开网页的执行过程

客户端向服务器发送一个请求，服务器在收到请求后将页面代码发送给客户端，然后通过浏览器的解析，生成用户所看到的页面。

（四）站点

站点：放置网站中的网页静态资源（html，css，js，图片，flash动画，gif）的文件夹。方便管理网站。

做网站的第一步即见文件夹。

（五）基本框架

html：超文本标记语言。（hypertextmark-up）

语法规则：

所有命令都要放到《》

大部分标记都是承兑出现

标签大部分都是《tag》开始，《/tag》结束

html语言不区分大小写

如：

标记a：《a》《/a》

标记b：《b》《/b》

基本框架：

步骤：计算机新建文件夹——新建记事本文件——扩展名改html——双击打开

注：出现乱码要设置浏览器字符编码。