认识网站
- 网站有网页构成,网页有静态和动态之分。
- 所谓静态网页是指用户无论何时何地访问,网页都会显示固定的信息 ,除非网页源代码被重新修改上传。静态网页更新不方便 ,但是,访问速度快。
- 而动态网页显示的内容则会随着用户操作和时间的不同而变化 ,这是因为动态网页可以和服务器数据库进行实时的数据交换 。
名词解释
- Internet 所谓Internet 就是通常所说的因特网,是由一些使用公用语言互相通信的计算机连接而成的网络 。Internet 实现了全球信息资源的共享。
- WWW(英文World Wide Web的缩写)中文译为“万维网”,它只是Internet提供的一种服务─网页浏览服务。
- URL(英文Uniform Resource Locator的缩写)中文译为“统一资源定位符”,其实就是Web地址,俗称“网址”。
- DNS(英文Domain Name System的缩写)是域名解析系统。
- HTTP(英文Hypertext Transfer Protocol的缩写)中文译为超文本传输协议,它是一种详细规定了浏览器和万维网服务器之间互相通信的规则 。是非常可靠的协议 它具有强大的自检能力。
- Web 对于普通用户来说,Web仅仅只是一种环境 ─互联网的使用环境、氛围、内容等。而对于网页设计、制作者来说,Web是一系列技术的复合总称(包括网站的前台布局、后台程序、 美工、数据库开发等),通常称其为网页。
- W3C(英文World Wide Web Consortium的缩写)中文译为“万维网联盟”,是国际最著名的标准化组织 。W3C 最重要的工作是d发展Web规范 。
Web标准
- Web标准并不是某一个标准,而是一系列标准的集合, 主要包括结构、表现和行为三方面。
- 结构标准:结构用于对网页元素进行整理和分类 ,主要包括XML和XHTML两部分。使内容更清晰 有逻辑性 。
- 表现标准:表现用于设置网页元素的版式、颜色、大小等外观样式,主要指的是CSS。用于修饰内容的样式。
- 行为标准:行为是指网页模型的定义及交互的编写,主要包括 DOM和ECMAScript两部分。内容的交互及操作效果。
HTML和CSS
- HTML和CSS是网页制作的标准语言。
HTML
- HTML,主要是通过HTML标记对网页中的文本、图片、声音等内容进行描述 。HTML提供了许多标记,如段落标记、标题标记、超链接标记、图片标记等。
- HTML的发展史:
①HTML 1.0:在1993年6月作为互联网工程工作小组(IETF)工作草案发布。
②HTML 2.0:1995年1 1月作为RFC 1866发布,于2000年6月发布之后被宣布已经过时。
③HTML 3.2:1997年1月14日,W3C推荐标准。
④HTML 4.0:1997年12月18日,W3C推荐标准。
⑤HTML 4.01(微小改进):1999年12月24日,W3C推荐标准。
⑥HTML 5:HTML5是公认的下一代Web语言,极大地提升了Web在富媒体、富内容和富应用等方面的能力,被喻为终将改变移动互联网的重要推手。
CSS
- CSS,主要用于设置HTML页面中的文本内容 (字体、大小、对齐方式等),图片的外形(宽高、边框模式、边距等)以及版面的布局等外观显示样式。CSS以HTML为基础,提供了丰富的功能。
- CSS非常灵活,既可以嵌入到HTML文档,也可以是一个单独的外部文件,如果是独立的文件,则必须以.css为扩展名。
- CSS的发展史:
1996年12月,W3C发布了第一个有关样式的标准CSS1,又在 1998年5月发布了CSS2.目前,最新的版本是CSS3,但是各个浏览器对它的支持不统一,所以流行的版本仍然是CSS2。
HTML文档基本格式
HTML文档基本格式主要包含<!doctype>文档类型声明、根标记、头部标记和主体标记
- < DOCTYPE>标记
< DOCTYPE>标记位于文档的最前面,用于向浏览器说明当前文档使用哪种HTML或XHTMIA标准规范。网页必须在开头处使用< DOCTYPE>标记为所有的HTML文档指定HTML版本和类型,只有这样浏览器才能将该网页作为有效的HTML文档,并按指定的文档类型进行解析。< DOCTYPI>标记和浏览器的兼容性相关,删除<! DOCTYPE>标记会把展示HTML页面的权利交给浏览器。这时有多少种浏览器,页面便会有多少种显示效果,这在实际开发中是不被允许的。 - < html >标记
< html >标记位于< DOCTYPE>标记之后,也称根标记。根标记主要用于告知浏览器其自身是一个HTML文档。< html >标记标志着HTML文档的开始,< /html >标记则标志着HTML文档的结束,在它们之间是文档的头部和主体内容。 - < head >标记
< head >标记用于定义HTML文档的头部信息,也称头部标记,紧跟在< htmb >标记后。头部标记主要用来封装其他位于文档头部的标记,例如< tite >、< meta >、< link >及< style >等,用来描述文档的标题、作者以及与其他文档的关系。需要注意的是,一个HTML文档只能含有一对< head >标记,绝大多数文档头部包含的数据都不会真正作为内容显示在页面中。 - < body >标记
< body >标记用于定义HTML文档所要显示的内容,也称主体标记。浏览器中显示所有文本、图像、音频和视频等信息都必须位于< body >标记内。< body >标记中的信息能最终展示给用户看。一个HTML文档只能含有一对< body >标记,且< body >标记必须在< html >标记内,创 头部标记之后,与< head >标记是并列关系。
HTML标记
单标记
(1).<标记名称>单一型,无属性值。如:< br />在xhtml中,规定,所有HTML标记,都要小写,所有的标记都要有关闭。
(2).<标记名称 属性=“属性值”>单一型,有属性值。
如:< hr width=“80%”/>
双标记
(3).<标记名称>…</标记名称>没有属性值。如:< title >…</ title>
(4).<标记名称 属性=”属性值“>…</标记名称>有属性。如:< font color=“pink”>…</ font>
说明:标记与属性,属性之间以空格分隔。
属性不区分先后顺序;且属性不是必要的。
注释标记
语法格式:< !-- 注释的内容 – >
注意:
html 注释标签不支持任何的标准属性和事件!
注释标记中不能嵌套注释标记。
HTML文档头部的相关标记
设置页面标题标记< title >
定义网页标题,显示在浏览器的标题栏中。
语法格式:< title >网页标题名称< /title >
定义页面元信息标记< meta />
< meat name="" content="">
1.keywords:网页的关键字
2.description:网页的描述
3.robots:(meta name=“robots” content=“all”),允许搜索引擎收录,
4.author:作者
5.copyright:版权
< meat htttp-equiv="" content="">
1.Content-Type:字符集(< meta http-equiv=“Content-Type” content=“text/html;charset=utf-8”>)
2.Refresh:页面自动刷新与跳转(< meta http-equiv=“refresh” content=“3000;url=http://www.baidu.com”>)
引用外部文件标记< link >
一个页面往往需要多个外部文件的配合,在< head >中使用< link >标记可引用外部文件,一个页面允许使用多个< link >标记引用多个外部文件。
<link rel="stylesheet" type="text/css" href="mystyle.css">
//表示引用当前HTML页面所在文件夹中,文件名为style.css的CSS样式表文件
内嵌样式标记< style >
用于为HTML文档定义样式信息
<head>
<title></title>
<style type="text/css">
h2{color:red;}
p{color:blue;}
</style>
</head>
<body>
<h2>二级标题</h2>
<p>段落</p>
</body>
HTML文本控制标记
标题标记
<hn align="对齐方式">标题文本</hn>
该语法中n的取值为1~6
align属性为可选属性:
①left 设置标题文字左对齐(默认值)
②center 设置标题文字居中对齐
③right 设置标题文字右对齐
注意: 一个页面中只能使用一个< h1 >标记
段落标记
<p align="对齐方式">段落文本</p>
水平线标记
<hr 属性="属性值" />
属于单标记,在网页中输入< hr />,就添加了一条默认样式的水平线
属性名 | 含义与属性值 |
---|---|
align | 设置水平线的对齐方式 可选择left.right.center三种值,默认为center,居中对齐 |
size | 设置水平线的粗细 以像素为单位,默认为2像素 |
color | 设置水平线的颜色可是颜色名称.十六进制#RGB ,rgb(r,g,b) |
width | 设置水平线的宽度可以是确定的像素值,也可以是浏览器窗口的百分比,默认为100% |
换行标记
<p>这是<br/>一个<br/>段落</P>
文本样式标记
<font 属性="属性值">文本内容</font>
属性名 | 属性值 |
---|---|
face | 设置文字的字体,例如微软雅黑、黑体、宋体等 |
size | 设置文字的大小,可以取1~7的整数值 |
color | 设置文字的颜色 |
文本格式化标记
标记 | 显示效果 |
---|---|
< b></ b>和< strong></ strong> | 文字以粗体方式显示(b定义文本粗体.strong定义强调文本) |
< i></ i>和< em></ em> | 文字以斜体方式显示(i定义斜体字,em定义强调文本) |
< s></ s>和< del></ del> | 文字以加删除线方式显示(HTML5不赞成使用s) |
< u></ u>和< ins></ ins> | 文字以加下划线方式显示(HTML5不赞成使用u) |
特殊字符标记
特殊字符 | 描述 | 字符的代码 |
---|---|---|
空格 |  ; | |
< | 小于号 | <; |
> | 大于号 | >; |
& | 和号 | &; |
¥ | 人民币 | ¥; |
© | 版权 | ©; |
® | 注册商标 | ®; |
° | 摄氏度 | °; |
± | 正负号 | ±; |
x | 乘号 | ×; |
÷ | 除号 | ÷; |
² | 上标2 | ²; |
³ | 上标3 | ³; |