2024年Web前端知识点总结.docVIP

HTML知识點

壹、功能

用来制作静态网页，网页中的所有内容都是通過Html語言展現出来。

使用場所：開发静态网页。

二、思想

壹切功能都由標签实現，標签具有四要素。

三、常用標签

標签关键字

功能

常用属性

font/font

设置字体,字号,颜色

face,color,size

br/

换行

center/center

居中對齐

hn/hn

设置標題级别

H1最大h6最小

align

hr/

插入水平线

size,width,align

p/p

划分段落,

align

ol/ol

创立有序编号列表

type,start

li/li

定义壹种列表项

ul/ul

定义無序符号列表

type

img/

插入图片

src,width,height,border,title,alt

table/table

插入表格

border,width,height,bgcolor,bordercolor,cellpadding,cellspacing

tr/tr

创立壹行

td/td

创立壹列

colspan,rowspan

th/th

创立壹列，元素居中，粗体

caption/caption

设置表格的標題

form/form

搜集顾客输入信息,并提交給服务器

action,method

inputtype=text/

创立文本框

name,value

readonly,disabled

inputtype=password/

创立密码框

inputtype=radio/

创立單项选择按钮

checked

select/select

创立下拉列表框

name

option/option

创立列表项

value,selected

inputtype=checkbox/

创立复选框

checked

textarea/textarea

创立文本区域

name,rows,cols

inputtype=hidden/

创立隐藏控件

inputtype=submit/

创立提交按钮

inputtype=reset/

创立重置按钮

a/a

超级链接,网页跳转

href,target

metaname=keywordscontent=淘宝网/

指定迅速的查询到该网页的关键字

metaname=descriptioncontent=淘宝网-亚洲最大/

開始；2標签添加class属性与样式关联。

5、属性选择器

標签名[属性名=属性值]，根据標签关键字和属性值自動关联。

6、包括选择器

1子样式名中间加或空格分隔(直接包括)；

2看最终壹种子样式是什么选择器就怎样关联標签。

7、多种样式名同同样式体

1样式名中间加逗号分隔；

2根据样式类型决定怎样与標签关联。

8、多条件同步成立选择器

1多种子样式名紧挨著

2壹种標签必须同步具有這多种条件才可以被该样式修饰

9、各选择器使用場所

1)假如想根据標签名用壹种样式修饰所有同名標签時，用標签选择器；

2)假如壹种样式只想修饰唯壹的壹种標签時，用id选择器；

3)假如壹种样式想修饰多种任意標签時，用类选择器；

4)尽量使用包括选择器。

四、元素定位

1、盒子模型

通過设置標签的内外边距從而变化元素的位置，没有脱离原则文档流。

有关属性：

marging-top：外上边距

margin-right：外右边距

margin-bottom：外下边距

margin-left：外左边距

margin：同步设置上右下左四個外边距(顺時针)

padding-top：内上边距

padding-right：内右边距

padding-bottom：内下边距

padding-left：内左边距

padding：同步设置上右下左四個内边距

border-top：设置上边线的粗细,颜色,线型

border-right：设置右边线的粗细,颜色,线型

border-bottom：设置下边线的粗细,颜色,线型

border-left：设置左边线的粗细,颜色,线型

border：同步设置四個边线的粗细,颜色,线型

border-width：只设置4個边线的宽度(粗细)

border-color：兄弟元素都设置浮動後成為壹行，脱离原则文档流。

有关属性

float:设置浮動定位

clear:清除浮動定位的影响

5、各定位方式使用場所

1)靠左或靠右，兄弟標签壹列变壹行，文字围绕——浮動定位。

2)移動位移比较小，用盒子模型。

3)移動位移比较大，父容器相對定位，子元素绝對定位。

五、添加独立css文献3环节

1、创立子文献夹和css文献

2、在html页面用link標签导入独立c