欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

HTML基础

程序员文章站 2022-04-26 11:53:20
...
一:相关概念了解

1:WEB标准的概念及其机构组成

WEB标准是一系列标准的集合,不是单一的某个标准。这些标准主要是由W3C(万维网)起草以及发布。

2:网页结构

网页主要是由三部分构成,分别是HTML、CSS、JAVASCRIPT。作用分别是HTML用于编写网页的页面结构,以方便对网页的布局和交互;CSS用于对网页进行布局排版,使网页的结构看起来更加美观;JAVASCRIPT用于人们和页面产生的交互动作后产生响应。相应的编程语言如下:
结构化语言有XHTML和XML
表现语言是CSS
交互行为语言是对象模型,(如W3CDOM、ECMAScript等)

3:W3C指定的结构和表现的标准:结构(XHTML、XML)、表现(CSS);ECMA指定的行为标准:行为(DOM , ECMASCRIPT)

4:文件名规范

文件名必须是小写字母开头,后接下划线、数字等,不可以使用中文或特殊字符作为文件名。

二:HTML及其相关概念

1:超文本标记语言与可拓展超文本标记语言

HTML指的是超文本标记语言(Hyper Text Markup Language),XHTML指的是可拓展超文本标记语言(EXtensible HyperText Language).

2:HTML5

HTML5指的是HTML的第五次重大修改;HTML5是W3C与WHATWG合作的结果。

3:HTML页面结构

HTML页面是由标签和属性构成,一个HTML文档主要是由head(文件头部)和body(文件主体)两部分组成。head部分一般不在浏览器窗口可见(除title和某些类型的meta标签以及网页logo外);body部分就是用户在浏览器视口区域看到的内容。

<html></html> html的根元素

<head></head> 文件头部

<body></body> 文件主体,页面上要显示的内容必须放在body体内。

<meta/> 设置字符集、内容类型、编码格式

<title></title> 文件标题

页面结构如下:

HTML基础

4:HTML分类

HTML文档可以分为三种类型,分别是strict(严格型)、transitional(过渡型)、frameset(框架型)。

5:书写规范

标签名和属性名称必须小写

HTML标签必须关闭

属性值必须用引号括起来

标签必须正确嵌套

必须添加文档类型声明(!DOCTYPE)

6:HTML基本语法

常规标记

<标记 属性=“属性值” 属性=“属性值”></标记>
空标记

<标记 属性=“属性值” />

7:常见的HTML标记

A:常见的块状标记

div、p、h1...h6、ol、ul、dl、table、address、blockquote、form

B:常见的内联标记

a、span、br、i、em、strong、label、q、var、cite、code

C:常见的内联块状标记(img会自带3个像素的外边距,在实际的操作中可以使用以下CSS样式语句去除:img{border:none;display:block;})

img、input

8:网页中常用的特殊字符

表示不换行空格
> 右尖括号
< 左尖括号
© 备案中图标

9:超链接

超链接是WWW的基础,也是其核心。单击这些链接,就可以从当前WEB页面跳转进入到另一个web网页。

其语法格式如下:

<a href="目标文件路径及全称/链接地址" target="_blank" alt= "替换文本" title="提示文本">链接文本/图片</a>

其中target属性表示是否在新窗口中打开链接;其属性值有两个:_blank和_self;_blank表示在新窗口中打开链接,_self表示在当前窗口中打开链接。

空链接:

<a href="#"></a>

链接到其他站点的链接

<a href="http://www.xxx.com">yyy</a>

链接到email

<a href="mailto:7463836@163.com">邮箱</a>

下载链接

<a href="aa.zip">文件下载</a>


URL又叫统一资源定位符,是WEB网页的地址,由4个部分构成:http协议,域名,端口号,路径。例如:http://www.cycf.org.cn:8080/index.html;其中http://称为http协议,www.cycf.org.cn叫做域名,:8080叫做端口号,index.html叫做页面路径。

10:路径

绝对路径:

绝对路径指的是主页上的我呢件或目录在硬盘上的真正路径,使用绝对路劲定位链接文件比较清晰;但是其有两个缺点:一是需要输入更多的内容;二是如果该文件被移动了,就需要重新设置所有的相关链接。


相对路径:

相对路径是最适合网站的内部链接的,只要是属于同意网站下的,即使不再同一个目录下,相对链接也非常适合。这种地址形式利用的是构建链接的两个文件之间的相对关系,不受站点文件夹所处服务器位置的影响。因此这种书写形式省略了绝对地址中的相同的相同部分。这样的优点是:站点文件夹所处的服务器地址发生改变时,文件夹的所有内部链接都不会出问题。


相对路径的写法:


A:当当前文件与目标文件在同意目录下,直接书写目标文件名+扩展名;

B:当当前文件与目标文件所处的文件夹在同一目录下,写法如下:

文件夹名/目标文件全称+扩展名;

C:当当前文件所处的文件夹和目标文件所处的文件夹不在同一目录下,写法如下:

../目标文件所处文件夹名/目标文件名+扩展名

相关标签: HTML5