网页-HTML

 
网页-HTML
2007年05月30日 星期三 09:14

一、基本概念:
网页、网站、浏览器、IE/NetScape
HTML:超文本标记语言,什么是超文本、什么是标记语言。
HTML的内容怎样显示出来。
二、HTML语法:
<html></html>
<head></head>
<title></title>
<body></body>
三、<body>的一些属性:
什么是属性:
text:设定整个网页中文字的色彩
link:用于设定一般超链接文本的显示色彩
alink:用于设定鼠标移动到超链接上并按下鼠标是超文本的显示色彩
vlink:设置访问过的超链接的色彩
background:设定背景图片,可以是绝对路径也可以是相对路径。
bgcolor:用户设定背景色,当已设定background时这个属性会失去作用     leftmargin:左边距
topmargin:上边距。
四、注释与特殊字符:
<!--.........-->
注释的内容不会被显示出来
注释不能被嵌套。
< <
> >
& &
" '
® 注册符号
© 版权符号
™ TM
      空格
五、格式标签
<p></p>:用来创建一个段落,可以用align属生来设置段落的对齐方式
<br>:单标记,没有结束标记,显示一个换行
<center></center>:对之间的图形或文本在水平方向居中显示
<marquee></marquee>:移动图片或文本。direction属性:内容的移动方向(left,right,down,up);behavior:指定内容的移动行为(scroll,alternate,slide)
<dl></dl><dt></dt><dd></dd>:用来创建一个普通列表。
< ol></ol><ul></ul><li></li>:<ol>< /ol>创建一个标有数字的列表;<ul></ul>对创建的列表标有一个圆点;<li>< /li>只能在<ol></ol>或<ul></ul>之间使用,表示列表项
<pre></pre>:对文本进行预格式处理
六、文本标签:
<h1></h1>......<h6></h6>:把文本以标题方式显示。
<b></b><i></i><u></u>:分别对应粗体,斜体,下划线
<sub></sub><sup></sup>:分别对应下上标的显示
<cite></cite>:引用方式的字体,通常是斜体
<em></em>:显示需要强调的文本,通常是斜体加粗
<strong></strong>:用来显示加重文本,通常是加粗显示
<font></font>:对字体、字号、颜色进行改变。face属性:字体;Size属生:大小;Color属生:色彩
七、图像标签: 
<img>
     src属性:必不可少,用来设置图像文件所在位置。
     alt属性:当鼠标移到图像上显示的提示文本,当图像无法显示时,所显示的代替文字
     align属性:设置图像与周围文本的对齐方式。top,bottom,left,right
     border属性:设置图像的边框宽度
     width和height:设置图像的长宽高
<hr>
     在HTML文档中加入一条水平线。
     size:线的粗细
     color:线的色彩
     width:线的长度
     noshade:阴影显示
八、超链接标签:
通一资源定位符:URL;
     如:http://www.gohy.net:80/index.htm
     http:所使用的协议;www.gohy.net:要访问的主机名;80:端口号;index.htm:文件名
相对URL:/-表示主机的根目录; .-表示当前目录; ..代表父目录;
     ./image:
     ../image:
     ../test/image:
<a href=""></a>:把中间标记的内容作为超链接显示,href的内容作为超连接点击后转向的页面。
     如: <a href="http://www.gohy.net">华育网</a>
      <a href="http://www.gohy.net"><img src="image/hy.gif"></a>
     href属性是不可少的;
     target属性:指明在浏览器的哪个窗口打开新页面。
<a name="">:锚点标记,在同一网页中设置多个锚点便于超链接的浏览。
     如: <a href="#标记1">跳转到第一个标记上</a>
mailto:打开电子邮件:
     <a href="mailto:grayworm@163.net subject=hello&body=您好">联系我们</a>
九、<map name=""></map>:图像地图将一个图像分成多个部分,各部分分别指向不同的链接。
<area shape="形状" coords="坐标" href="url">:给图像分块
shape属性可以是以下几种形状:
     rect:矩形,此时的coords为矩形的左上角个右下角的坐标
     poly:多边形,此时的coords为多边形的各个顶点
     circle:圆,此时coords为圆习坐标及半径
如:
<img src="chinagif" usemap="mymap">
<map name=mymap>
     <area shape="rect" href="a.html" coords="140,20,280,60">
     <area shape="poly" href="b.html" coords="100,100,180,80,200,400">
     <area shape="circle" href="c.html" coords="10,60">
</map>
十、表格标签:<table></table><tr></tr><td></td>
这三个标签的层次结构:
<table></table>:定义一个表格的开始和结束
<tr></tr>:定义一行的开始和结束
<td></td>:定义一个单元格的开始和结束
<table></table>的属性:
     bgcolor:设置表格的背景色彩
     border:设置表格的边框的宽度
     bordercolor:设置表格边框色彩
     bordercolorlight:设置表格边框明亮部分的色彩
     bordercolordark:设置表格边框昏暗部分的色彩
     cellspacing:设置单元格之间的间隔
     cellpadding:设置单元格内部的内容与边框的间隔
     width:表格的宽度
     height:表格的高度
<tr></tr>
     align:整行单元格的内容水平对齐方式left,center,right。
     valign:整行单元格的内容竖直对齐方式top middle,bottom
     bgcolor:设置这一行的色彩
<td></td>
     width:单元格的宽度(大小)
     height:单元格的高度
     align:单元格内部内容的水平对齐方式
     valign:单元格内部内容的竖直对齐方式
     colspan:设置一个单元格跨占的列数
     rowspan:设置一个单元格跨占的行数
     nowrap:禁止单元格内的内容自动换行
<th></th>与<td></td>类似只不过里面显示的内容是黑体居中的
十一、框架标签<frameset></frameset><frame></frame>:
什么是框架:将一个窗口分割成多部分,每一部分显示一个独立的页面。
框架只是分割窗口。
<frameset></frameset>定义一个框架集:
     rows:将窗口竖直拆分时窗口的大小比例
     cols:将窗口水平拆分窗口的大小比例
<frame></frame>定义一个具体的框架窗口:
     src:要显示网页的URL
     name:框架窗口的名子
     taget:该框架中的超链接默认的打开窗口_blank,_parent,_self,_top。
     scrolling:是否在框架边上出现滚动条yes,no,auto
     noresize:禁止用户拖动分隔线来调整框架的大小,直接将该属生放入就可以了。
<iframe></iframe>在一个网上插入一个简单的框架窗口,这个窗口用来显示另一个文件。
     name:框架窗口的名子
     src:框架窗口中所显示的新的网页
十二、表单标签:
什么时表单?
<form></form>:定义表单的开始和结束位置<略讲>
     action:处理表单内容的服务器程序的URL
     method:提交给服务器处理表单信息的方式
      get:将表单信息以URL参数的形式附在action的URL后面
      set:将表单信息以HTTP消息实体发送给WEB服务器
     target:设置服务器返回结果显示的窗口
     title:当鼠标放在表单上的时候以黄色的泡泡进行提示
<input type="submit">:定义一个提交按钮
     action:指定URL所指定的服务器程序
     value:按钮上的文字
<input type="reset">:定义一个重新填写的按钮。
     value:按钮上的文字
<input type="text">:定义一个单行文本框
     size:输入区域的宽度,以字符个数为单位
     value:文本框的内容
     maxlength:用户能够输入的最大字符串长度
     readonly:属性存在时,文本框可以获得焦点,但用户不能更改里面的内容。
     disable:属性存在时,文本框不能获得焦点,也不能更改里面的内容。
<input type="checkbox">:定义一个复选框
     name:复选框的名,同一组复选框用同一个名子
     checked:该复选框是否被选中
     value:指定复选框被选中时,这个复选框的后台值
<input type="radio">:定义一个单选按钮
     name:单选按钮的名,同一组单选按钮用同一个名子
     value:指定单选按钮被选中时,这个单选按钮的后台值
<input type="hidden">:在表单上添加一个隐式的字段的元素,浏览器不会显示这个字段
     name:名子
     value:值
     当表单提交的时候会以name=value的形式提交到服务器上去。
<input type="button">:在表单上定义一个普通的按钮,这个按钮通常与某个脚本代码下关联
<input type="password">:在表单上定义一个密码输入区域.
<input type="file">:用来从本机向服务器传文件
<input type="image">:在表单上创建一个图像元素。
     图像的源文件由src属性来指定,它没有value属性。
     图像元素在某些情况下可以代替submit按钮来使用
     单击图像元时就会将表单信息和单击处的x,y值一起发送到服务器
<select></select>创建一个下拉列表框或可以复选的列表框。
     size:设置列表框中可见选项的数目。默认值是1,这时显示的是下拉列表框。
     mutiple属性:这是一个不且赋值的属性,定义列表框是否可以多选。
     在列表框中定义各项是用<option></option>来实现的。
<option></option>为列表框中添加项目
     value:项目的后台值
     selected:指定项目是否被选定
<textarea></textarea>创建一个可输入多行文本的文本框
     cols:文本框的列数
     rows:文本框的列数
十三、分区标签:
<div></div>:区域标签,层
<span></span>:区域标签
十四、头元素:
<base>标签:用于指定网页中超链接的基准地址。网页中所有超链接的相对地址都以该地址为基准地址。
     该标签只能放在<head></head>标签之间。
     如:<base href="http://www.gohy.net/image" target="_blank">
<meta>标签:通常用于文件的<head></head>之间。主要有两种类型的<meta>,它们用不同的属性名(name,http-equiv)来划分。
     name属性主要用于在网页中加入一些关于网页的描述信息,例如,网页的关键字,网页的描述信息等
     http-equiv属性主要用于在HTML文档中模拟HTTP头。
     什么是HTTP头?
      通过访问网页时,服务器除了返回网页文件本身的内容(也就是在浏览器中用查看源文件能看到的东西)之外,它 还在返回网页文件内容之前,传送一部分被称为HTTP头的内容给浏览器,这部分肉容是在浏览器的查看源文件中看不到的。HTTP头的内容相当于服务器发送 给浏览器的一些暗号指令,通知浏览器查看该网页时应使用的字符编码、是否本地缓存、网页的到期时间、是否间隔一定时间以后刷新页面或跳到其它页面等。
  
     name属性的设置:
      Keywords:网页的关键字,以便于在搜索引擎中进行收集信息。
       <meta name="keywords" content="软件工程师培训,清华IT,华育国际">
      Description:网页描述信,以便于搜索。
      Generator:用于编辑此页所用的工具名,content中填入所用的网页编辑软件。
      Author:用于说明网页的作者,content中填入作者的姓名。
      Copyright:用于版权声明,content中填入你的版权声明。
     http-equiv属性设置:
      Content-Type:用于说明网页内容的类型以及文本内容所使用的字符集编码。
       <meta http-equiv="Content-Type" content="text/html;charset=gb2312">
      Refresh:告诉浏览器定时自动刷新网页
       <meta http-equiv="Content-Type" content="1;url=http://www.sina.com.cn">
       通知浏览器过一秒后跳转到新浪网上去。
      Expires:用于设定网页的到期时间。为了提高效率,浏览器可以被设置成缓存以前访问的页面,当再次访问该页面时,浏览器不会再去服务器上访问,而是直接在本地缓存中读到。如果将其Content设为0则禁止浏览器使用缓存页面。
       <meta http_equiv="Expires" content=""Mon,12,May,2007 00:00:00 GMT>
      Windows-Target:强制页面在某个窗口显示。例如要防止别人把你的网页作为frame页面调用:
       <meta http-equiv="Windows-Target" content="_top">

原文地址:https://david.blog.csdn.net

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


HTML代码中要想改变字体颜色,常常需要使用CSS样式表。CSS是一门用来描述网页上样式的语言,通过编写CSS代码可以实现网页中各元素的大小、颜色、字体等各种样式的控制。那么如何在HTML代码中应用CSS样式来改变字体颜色呢?这里为大家介绍一下。 首先,在HTML代码...
HTML代码如何让字体盖住图片呢?需要使用CSS的position属性及z-index属性。 img { position: relative; z-index: -1; } p { position: absolute; to...
HTML代码字体设置 在HTML中,我们可以使用标签来设置网页中的文字字体。常用的字体标签是font和style,下面我们来学习如何使用这些标签。 1. font标签 使用font标签可以改变文字的字体、颜色和大小。它有三个属性font-family、color和...
在网页设计中,HTML代码的字体和字号选择是非常重要的一个环节,因为它们直接关系到页面的可读性和视觉效果。 要指定文本的字体和字号,可以使用HTML中的样式属性。使用样式属性设置字体和字号,如下所示: <p style="font-family: Aria...
HTML(Hypertext Markup Language,超文本标记语言)是一种用于创建网页的标准语言。它由许多标签(一对尖括号包围的关键字)组成,这些标签告诉浏览器如何显示内容。使用HTML代码,我们可以轻松地创建各种类型的图像和图形,如太极图。 在HTM...
外链是指在一个网页中添加一个指向其他网站的链接,用户可以通过这个链接直接跳转到其他网站。在HTML中,实现外链的方法很简单,只需要使用标签就可以了。 <a href="http://www.example.com">这是一个外链,点击跳转到www.ex...
HTML代码是实现网页界面的基础,而网页中的各种表单则是用户和网站进行交互的重要方式之一。下面我们来介绍如何使用HTML代码实现一个简单的报名表格。 <form action="submit.php" method="post"> &lt...
HTML是一种标记语言,用于开发网站和其他互联网内容。字体是网站设计中的关键元素之一,它可以决定网站的整体风格和呈现效果。HTML提供了字体编辑器,使网站设计变得更加容易。 <font face="Arial"> 这里是Arial字体 &...
HTML代码中,字体样式是开发者们必备的一部分。在HTML中,我们可以通过特定的标签和属性设置字体的样式、颜色和大小,以达到更好的排版效果。 <p style="font-size: 14px; color: #333; font-family:...
HTML中的字体可以设为粗体,以强调文本信息。我们可以通过使用一些标签来实现这一功能。其中,常用的标签包括: 1. 标签:该标签会把文本加粗显示,语法如下: 这是一段加粗的文本 2. 标签:与标签作用相同,但语义更强,表示该文本内容的重要性。语法如下:...
HTML代码可以实现文件的上传和下载,在网页开发中相当常见。通过使用<input>标签和<form>标签,我们可以轻松创建一个文件上传表单。 <form action="upload.php" method="post" enct...
HTML代码非常常见于网页设计中。在一些需要处理时间相关数据的场景下,可能需要将时间戳转换为实际时间,这时候就需要使用一些特定的HTML代码。 function timeStamp2Time(time){ var date = new Date(time...
HTML是一种用于创建网页的标记语言。在HTML中,我们可以使用超链接标签实现下载文件到本地的功能。 具体实现步骤如下: <a href="文件的URL" download="文件名">下载文件</a> 其中,href属性是文件...
在HTML代码中,对于字体靠左对齐有各种方法。其中最简单的方式之一是使用pre标签。 使用pre标签可以保留一段文本中的空格和换行符,从而使代码排版更加整齐。下面是一个例子: <p>这是一个段落。</p> &lt...
HTML代码字典是一本解释HTML标记和属性的参考文献。这本字典中包含了最常用的HTML代码以及它们的属性和值的详细描述。 例如,以下是HTML代码字典中的一部分内容: <a href="url">link text</a> 在...
在网页开发过程中,遇到一些需要用户复制的内容,我们通常都会提供复制按钮,让用户更方便地复制所需内容。下面我们来介绍如何使用html代码实现一键复制的功能。 var copyBtn = document.querySelector('#copy-bt...
用户登录 欢迎来到公司登录界面,请输入用户名和密码登录 用户名: 密码: 代码解释: 第1行:定义了一个 HTML 文档 第2行:开始了 HTML 头部 第3行:定义了...
HTML 代码是用来创建网页的语言,它包含了许多不同的元素和属性,让我们可以在网页中添加各种不同的元素和内容,如文字、图片、链接等等。在编写 HTML 代码时,我们可以使用各种不同的样式来美化我们的网页,例如更改字体、颜色、大小等等。 font-family:...
HTML代码中的字体转移 在编写HTML代码时,我们经常会使用各种字体来增强页面的可读性和视觉效果。但是,有些字符或特殊符号可能会在HTML中具有不同的含义,这就需要使用字体转义转换成HTML可以正常显示的字符。 在HTML中,使用"&"符号表示一个特殊字符将要被转...
HTML 编程语言中,你可以使用字体属性来更改文本的字体大小、颜色和样式。其中,字体颜色是最常用的样式更改。在 HTML 中,你可以使用 "color" 属性来更改文本的颜色。下面是一个使用 "pre" 标签的代码示例,演示如何使用 "color" 属性来更改字体颜色...