1000字范文,内容丰富有趣,学习的好帮手!
1000字范文 > 上中下结构html网页代码 简单理解网页源码(HTML源代码)

上中下结构html网页代码 简单理解网页源码(HTML源代码)

时间:2021-06-20 20:11:33

相关推荐

上中下结构html网页代码 简单理解网页源码(HTML源代码)

程序员无论做什么程序, 基本都会接触HTML, 如果做web开发 这就是吃饭的家伙, 移动端APP 的没学过HTML不要紧, 但是要一眼大概可以看懂网页源代码, 有机会最好亲自学习一下HTML5, 最自身的提高还是有所帮助的

HTML, 超文本标记语言. 简单理解为某些字句加上标志的语言,从而实现预期的特定效果。网页正是由这种HTML语言所编写出来的。作为一套标记语言,基本上只要明白各种标记的用法就算学会了HTML

HTML的语法格式分为嵌套与非嵌套两类,嵌套格式为<标记>...</标记>,非嵌套只为<标记>。此外,根据标记的不同,有的标记附带有属性参数,则表示为<标记属性="参数值">,根据个人需要,可添加或去掉相应的属性标记

一. 基本框架

如同人一样,网页也包括了“头部”和“身体”,如图就是标记符号。

<head>标记内包含着诸如网页标题、语言编码、网页描述等基本信息,而平时我们真正见到的网页内容均放在<body>标记内。现在先介绍一下<head>里的基本信息。

网页标题(标记格式为<title></title>)

创建网页标题文字:<title>标题</title>//此处书写的文字会显示在IE的标题栏上。

网页文档信息(标记格式为<meta>)

描述网页内容类型:<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">//该页面为TXT文本或HTML格式,语言编码方式为GB2312(即简体中文)。

描述网页的关键字信息:<metaname="keywords"content="这里是关键字">

对网页的详细描述:<metaname="description"content="这里是对该网页的介绍">

刷新网页:<metahttp-equiv="refresh"content="5;URL=xxx.htm">//5秒种后刷新,并链接到xxx.html

二、组成要素

无论网页如何千变万化,构成一个网页内容的最基本要素大体只有五种,即文字、图片、表格、超链接和表单控件,所以下面将围绕着这五个要素逐一列举介绍。

文字(标记格式为<font></font>)

指定文字字体:<fontface="宋体">宋体文字</font>

指定文字大小:<fontsize="3">3号文字</font>

指定文字颜色:<fontcolor="#FF0000">红色文字</font>//网页颜色采用16位编码,因此#FF0000表现为红色。大家可以查阅相关资料了解其他颜色的编码。

图片(标记格式为<img>)

<imgsrc="/Files/Pic/-9/4/069409563356425.jpg"width="400"height="300"border="2"align="center">//src指定为路径地址,width为宽度,height为高度,border为边框大小,align为横向位置。

表格(标记格式为<table><tr><td></td></tr></table>)

<tablewidth="400"height="300"border="1"align="center"cellpadding="2"cellspacing="2"bgcolor="#FF0000"><tr><td>此处添加文字或图片等</td></tr></table>//width、height、border、align与以上的例子作用一样,cellpadding为边框与单元格的间距,cellspacing为单元格之间的间距,bgcolor为表格背景色。

以上所介绍的元素都是只存在当前页中,而网页超链接的出现大大改变了人们的浏览习惯,可根据自己喜好,点击到相关链接查看网页信息。

超链接(标记格式为<a></a>)

<ahref="xxx.htm"title="提示文字">链接文字或图片</a>//href为被点击后的链接页,title为鼠标悬停在链接文字或图片上后出现的提示文字。

表单控件(标记符号为<input>、<textarea></textarea>、<select></select>)

表单控件实现了人与网页的交互,像大家常去的论坛、购物站点等都有它的“身影”。

文本框:<inputtype="text"value="这是文本框">//value为该控件的值,以下每个表单控件均可设定,不设默认为空

密码框:<inputtype="password">

单选框:<inputtype="radio">

复选框:<inputtype="check">

提交按钮:<inputtype="submit">

重置按钮:<inputtype="reset">

隐藏区域:<inputtype="hidden">

文本域:<textarearows="6"cols="30"></textarea>//rows为行数,cols为宽度

列表框:<select><option>项目1<option>项目2<option>项目3</select>

, 查看HTML网页源代码 可以了解网页的内容, 结构, 根据我们自己的需求对网页中的数据进行更改, 过滤, 排版. 所以多学一门语言有益无害, 活到老 学到老.

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。