一、web标准
1:w3c万维网联盟组织 用来制定web标准的机构(组织)
2:web标准:制作网页要遵循的规范
3:web标准规范的分类: 结构标准 表现标准 行为标准
4:结构: html 表现: css 行为:javascript
web标准总结:
结构标准:相当于人的身体
表现标准: 相当于人的衣服
行为标准: 相当于人的动作
二、常见浏览器介绍
浏览器是网页运行的平台,常用的浏览器有IE、火狐(Firefox)、谷歌(Chrome)、Safari和Opera等。
Html就是用来制作网页的。
Css就是对网页进行美化的(网页的美化师)
Js就是让网页动起来,具有生命力的。
三、html简介
1:html (Hyper Text Markup Language ) 中文译为“超文本标记语言”,主要是通过html标记对网页中的文本,图片,声音等内容进行描述
2:HTML之所以称为超文本标记语言,不仅是因为他通过标记描述网页内容,同时也由于文本中包含了所谓的“超级链接”,通过超链接可以实现网页的跳转。从而构成了丰富多彩的Web页面。
HTML基本文档格式— 标记
HTML基本文档格式— 标记
标记用于定义HTML文档的头部信息,也称为头部标记,紧跟在标记之后,主要用来封装其他位于文档头部的标记。
一个HTML文档只能含有一对标记,绝大多数文档头部包含的数据都不会真正作为内容显示在页面中。
HTML文档头部相关标记—
HTML基本文档格式— 标记
四、html标签关系
1.嵌套关系
2.并列关系
嵌套关系:类似父亲和儿子之间的关系
并列关系:类似与兄弟之间的关系
五、html标签分类
HTML标记—双标记
双标记也称体标记,是指由开始和结束两个标记符组成的标记。其基本语法格式如下:
<标记名>标记名>
该语法中“<标记名>”表示该标记的作用开始,一般称为“开始标记(starttag)”,“标记名>”表示该标记的作用结束,一般称为“结束标记(end tag)”。和开始标记相比,结束标记只是在前面加了一个关闭符“/”。
HTML标记—单标记
单标记也称空标记,是指用一个标记符号即可完整地描述某个功能的标记。其基本语法格式如下:
<标记名/>
六、开发工具
七、单标记详解
水平线标记
在网页中常常看到一些水平线将段落与段落之间隔开,使得文档结构清晰,层次分明。这些水平线可以通过插入图片实现,也可以简单地通过标记来完成,<hr/>就是创建横跨网页水平线的标记。其基本语法格式如下:
<hr/>是单标记,在网页中输入一个<hr/>,就添加了一条默认样式的水平线。
注释标记
在HTML中还有一种特殊的标记——注释标记。如果需要在HTML文档中添加一些便于阅读和理解但又不需要显示在页面中的注释文字,就需要使用注释标记。其基本语法格式如下:
注释内容不会显示在浏览器窗口中,但是作为 HTML 文档内容的一部分,也会被下载到用户的计算机上
换行标记<br />
在HTML中,一个段落中的文字会从左到右依次排列,直到浏览器窗口的右端,然后自动换行。如果希望某段文本强制换行显示,就需要使用换行标记<br />,这时如果还像在word中直接敲回车键换行就不起作用了。
图像标记<img />
HTML网页中任何元素的实现都要依靠HTML标记,要想在网页中显示图像就需要使用图像标记,接下来将详细介绍图像标记<img/>以及和他相关的属性。其基本语法格式如下:
该语法中src属性用于指定图像文件的路径和文件名,他是img标记的必需属性。
<img />标记属性
属性 |
属性值 |
描述 |
src |
URL |
图像的路径 |
alt |
文本 |
图像不能显示时的替换文本 |
title |
文本 |
鼠标悬停时显示的内容 |
width |
像素(XHTML不支持%页面百分比) |
设置图像的宽度 |
height |
像素(XHTML不支持%页面百分比) |
设置图像的高度 |
相对路径
相对路径不带有盘符,通常是以HTML网页文件为起点,通过层级关系描述目标图像的位置。
<imgsrc="img/logo.gif"alt="传智播客-专业的java培训,.net培训,php培训,网页培训,平面培训,iOS培训机构"/>
相对路径设置分为以下三种:
绝对路径
绝对路径一般是指带有盘符的路径。
例如:
“D:\HTML+CSS网页制作\chapter02\img\logo.gif”,
或完整的网络地址,例如“http://www.itcast.cn/images/logo.gif”。
八、双标记详解
段落标记
在网页中要把文字有条理地显示出来,离不开段落标记,就如同我们平常写文章一样,整个网页也可以分为若干个段落,而段落的标记就是。
是HTML文档中最常见的标记,默认情况下,文本在一个段落中会根据浏览器窗口的大小自动换行。
标题标记
为了使网页更具有语义化,我们经常会在页面中用到标题标记,HTML提供了6个等级的标题,即、、、、和,从到重要性递减。其基本语法格式如下:
文本样式标记
文本格式化标记
标记 |
显示效果 |
和 |
文字以粗体方式显示(XHTML推荐使用strong) |
和 |
文字以斜体方式显示(XHTML推荐使用em) |
|
文字以加删除线方式显示(XHTML推荐使用del) |
和 |
文字以加下划线方式显示(XHTML不赞成使用u) |
创建超链接
在HTML中创建超链接非常简单,只需用标记环绕需要被链接的对象即可,其基本语法格式如下:
在上面的语法中,标记是一个行内标记,用于定义超链接,href和target为其常用属性,下面对它们进行具体地解释。
注意:
锚点链接
通过创建锚点链接,用户能够快速定位到目标内容。
创建锚点链接分为两步:
十、特殊符号标记
特殊字符 |
描述 |
字符的代码 |
|
空格符 |
|
< |
小于号 |
< |
> |
大于号 |
> |
& |
和号 |
& |
¥ |
人民币 |
¥ |
© |
版权 |
© |
® |
注册商标 |
® |
° |
摄氏度 |
° |
± |
正负号 |
± |
× |
乘号 |
× |
÷ |
除号 |
÷ |
² |
平方2(上标2) |
² |
³ |
立方3(上标3) |
³ |
无序列表 (ul)
有序列表(ol)
-有序列表其他属性 type start
-语法格式:
<ol type=value1 start=value2>
ol>
value1表示有序列表项目符号的类型, value2表示项目开始的数值. start是编号开始的数字,如start=2则编号从2开始,如果从1开始可以省略,或是在标签中设定value="n"改变列表行项目的特定编号,例如。type=用于编号的数字,字母等的类型,如type=a,则编号用英文字母。使用这些属性,把它们放在<ol>或的的初始标签中。
type类型 |
描述 |
Type=1 |
表示列表项目用数字表示(1,2,3…..) |
Type=a |
表示列表项目用小写字母表示(a,b,c..) |
Type=A |
表示列表项目用大写字母表示(A,B,C..) |
Type=i |
表示列表项目用小写罗马数字表示(i,ii,iii….) |
Type=I |
表示列表项目用大写罗马数字表示(I,II,III…) |
自定义列表(dl)