admin 管理员组

文章数量: 1184232


2024年3月6日发(作者:少儿编程老师培训机构)

Web前端期末复习【超实用】

这本书的HTML内容完完整整总结如下(书上有些属性已过时)

HTML学习总结

vlink="" leftmargin="">

" < ©

& >--> ®

字号默认为3

粗体

斜体

上标下标大号字小号字下划线

删除线

单标记只跟上文产生一空行间隔,双标记则与上下文都产生

两个
等效于一个

单标记

 

预格式化标记

居中标记
缩排标记


水平线

  1. 有序列表

  • 无序列表

名词一

第 1 页 共 19 页

解释一

解释二

滚动字幕

嵌入视频

type="application/x-shockwave-flash">

Java小程序

<body>浏览器版本过低,不支持框架</body>

亚洲

声明一行

第 2 页 共 19 页

/bottom">表格标题

声明一单元格

maxlength="最多可输入" size="默认24" value="默认值" checked="checked"

onclick="delete"/>

这本书的CSS内容总结(书本只列举最常用的东西)

一、标记选择器★

第 3 页 共 19 页

二、字体属性

font-size(绝对大小、相对大小、百分数、具体值pt、px、in)

font-family

font-weight(normal、lighter、bold、bolder)

font-style(normal、italic=oblique)

三、文本属性

text-indent首行缩进,常用单位是pt

line-height行间距,常用单位是pt

letter-spacing字间距,常用单位是pt

text-decoration(underline、overline、line-through、none)

text-align(left、center、right、justify两端对齐)

四、列表属性

list-style-image用图像作为列表项的引导符号

list-style-position决定缩进程度(outside列表贴近左侧边框显示、inside列表缩进显示)

list-style-type(none、disc●、circle○、square■、decimal普通数字、lower-roman小写罗马字、upper-roman大写罗马字、lower-alpha小写英文、upper-alpha大写英文)

五、颜色和背景

color

background-color

background-image

第 4 页 共 19 页

background-repeat(repeat-x横向重复、repeat-y纵向、repeat、no-repeat)

background-position(left、right、center、top、bottom)

六、区块

width、height、float让文字环绕周围、clear禁止浮动元素出现在所属对象旁边、padding内边距、margin外边距(top、bottom、left、right)

七、层属性(允许盒子重叠)

top(单位px)、left、width、height、Z-index包含正负数,决定层的先后顺序和覆盖关系,值高的覆盖较低的

clip限定只显示裁切出来的区域,该区域是矩形。只要设置两点即可(矩形左上角顶点由top和left设置、右下角由bottom和right设置)

overflow(visible当层内的内容超出层所能容纳的范围时可见、hidden、scroll、auto)

★定位流position(static静态定位、relative相对定位、absolute绝对定位、fixed固定定位)

①static:默认属性值,盒子按照标准流(包括浮动方式)进行布局。

②relative:相对于自己以前在标准流中的位置偏移指定距离。通过left、right、top、bottom指定偏移量。

在相对定位中同一方向上的定位属性只能使用一个;

∵相对定位是不脱离标准流的,会继续在标准流中占用空间 ∴区分块级元素、行内元素、行内块级元素且设margin、padding等属性会影响标准流的布局。

一般用于盒子位置的微调。

③absolute:相对于body或某定位流(非static属性)中的祖先元素来偏移。默认是相对于body定位的,会随着页面的滚动而滚动。

∵脱离标准流,不会占用标准流的位置 ∴不区分 ~

绝对定位元素会忽略祖先元素的padding

一般配合相对定位来使用,不会单独出现 eg.做覆盖效果

第 5 页 共 19 页

④fixed:盒子位置固定在浏览器窗口上。

∵脱离标准流,不占位 ∴不区分

当给一个元素设置的宽高无效时,可以通过display将模式转换:块↔行内 ;块、行内→行内块

块级元素display="block":独占一行。可任意设置其大小、内外边距(宽度默认为所在容器的100%),是用于搭建网页布局的必须部分,使网页结构更紧凑。常见的块级元素有

~

    、等,其中
    是最常用最典型的。可容纳行内元素和其他块元素。特殊:文字类的块级元素不能放块元素,例如

    /

    ~

    /

    行内/内联元素display="inline":和相邻的行内元素在同一行上。设置宽高无效(默认宽高是他自身内容的宽高)。水平方向的padding和margin属性可以设置,但垂直方向上的无效。行内元素只能容纳其他行内元素或者文本。特殊:可以放块级元素,但是链接里面不能再放链接。

    行内块级元素display="inline-block":和相邻行内元素在同一行,但是之间会有空白缝隙。默认宽度是他本身内容的宽度。宽度、高度、行高、内外边距和对齐模式都可以手动设置。如

    八、盒子模型★

    border-color

    border-width

    border-style:none、hidden、dotted、dashed、solid、double

    padding设置1个属性值:表示上下左右4个内边距。

    第 6 页 共 19 页

    padding设置2个属性值:前者表示上下内边距,后者表示左右内边距。

    padding设置3个属性值:前者表示上内边距,中间者表示左右内边距,后者表示下边距。

    padding设置4个属性值:依次表示上、右、下、左内边距(顺时针)。

    padding是内边距,不会影响盒子的外部,而margin是外边距,直接影响。

    ★两个行内元素间的水平间距 = 左边元素的右外边距 + 右边元素的左外边距

    ★两个块级元素间垂直间距 = Max(上边元素的下外边距,下边元素的上外边距) 称为margin的"塌陷"现象,即较小margin塌陷到较大margin中了的块级元素间的垂直定位。

    ★父子盒子嵌套,当子div的margin为正值时:父盒子宽度随浏览器自由延伸,子盒子宽度随父盒子之变而变

    当子div的margin为负值时:①子盒子本身没有宽度,会增加元素宽度 ②子盒子本身有宽度,会产生位移

    ③margin-top= -100px 却产生了向上50px的位移 (挠头疑惑!

    第 7 页 共 19 页

    float:none、left、right,非none的属性值将所有对象视作“块对象block-level”,忽略它原有的display值,并脱离标准流。默认情况下,根据对象内容来决定其宽、高。非浮动对象会代替浮动对象在标准流中的位置,且其文字内容会围绕浮动对象。

    九、Div标记&Span标记

    是区块容器标记,块级元素,
    内的元素会自动换行,这是与的区别所在。
    容器装的是内容,CSS作为装饰内容的样式。

    是相对

    较小的容器,行内元素,在它前后不会自动换行,没有结构意义,纯粹应用CSS。

    DIV+CSS布局&表格布局の比较:

    ●通过

    各个单元格可轻松划分模块,制作简单;CSS通过
    来划分模块,同时需要调整各模块间的位置及排列。

    ●各模块放在

    内,会随着单元格的大小自动调整,背景颜色等设置比较简单;DIV+CSS的模块层层嵌套,背景颜色等样式属性设置比较复杂。

    ●单元格可加入CSS的margin和padding等属性控制效果。

    ●表格布局比DIV+CSS布局维护要困难。eg.要对换left和right的内容,表格布局的工作量与制作新的页面相当,而DIV+CSS布局只需修改位置即可。

    十、鼠标属性

    cursor:default、pointer手形状、crosshair十字交叉、text文本选择、wait为Windows的沙漏形、help问号、e-resize指向东的箭头、ne-resize东北、n-resize北、nw-resize西北、w-resize西、sw-resize西南、s-resize南、se-resize东南)

    十一、滤镜属性

    filter:mark为对象建立一个覆盖于表面的膜、blur模糊效果、chroma设对象中指定的颜色为透明色、dropShadow阴影效果、flipH水平翻转、flipV垂直翻转、glow光晕、invert对象的可视化属性全部翻转,包括色彩、饱和度和亮度、shadow

    第 8 页 共 19 页

    在指定方向建立物体投影、wave把对象按垂直波纹样式打乱、xray使对象产生X光片效果、alpha设透明度

    十二、在HTML中用CSS★

    解决CSS冲突:

    ●优先级:内联式(直接在标签里写style="...") > 内嵌式(写在里的

    5

    长春工业大学

    /

    页面跳转倒计时:5

    将跳转至主页

    期末考试最后两大题(其它的没保留截图)

    第 18 页 共 19 页

    第 19 页 共 19 页


    本文标签: 元素 属性 对象

    更多相关文章

    Win10系统下的蓝牙耳机Stereo模式声音去哪儿了?快速定位和恢复教程!

    1月前

    我是笔记本荣耀 MagicBook 16 Pro连接FreeBuds 4 只有hands free有声音而stereo没有查阅过网络资料都不行去荣耀授权点让你重装系统,无奈之下只好自己来了,这次集合我搜集到的所

    专业杀毒,直面RavMon.exe挑战,让安全常伴左右

    1月前

    RavMon.exe是一个强制不显示系统的隐藏文件的 简单病毒,顽固且有备份,涉及到很多操作。网络安全课上的学习研究成果运行环境:Windows XP 病毒的特性:

    不花钱也能享受高速网速:教你如何将电脑变成无线路由器

    1月前

    其实win7本身就自带无线热点的功能,按下面的方法设置。 开启windows 7的隐藏功能:虚拟WiFi和SoftAP(即虚拟无线AP),就可以让电脑变成无线路由器,实现共享上网,节省网费和路由器购买费。 以

    Win11系统IP配置大揭秘,轻松搞定IP设置

    1月前

    说明:由于项目开发的需要,有时候要更改主机的ip地址来进行测试或进行合作开发,以下是修改主机ip地址的步骤。 1、选择此电脑(我的电脑),右击选择属性,进入如下面板选择网络与Internet,接着点击

    再也不怕Win7关机后自动重启,修复秘籍来了!

    1月前

    1.到系统的设备管理器,选择网络适配器,选择你的网卡右键属性,在高级里把唤醒功能和网络唤醒的值设成 无 2. 关闭系统发生错误时电脑自动重启的设置,鼠标右键点击“我的电脑”——》选择“属性”——》在

    Windows XP新手必学:轻松定制你的任务栏外观

    1月前

    1、在XP系统的任务栏属性里,开启显示“快速启动栏”鼠标右击电脑桌面底部的“任务栏”–》属性—》勾选√“显示快速启动” 2、点击桌面左下角的“开始”–》运行–》输入: regsvr32 n i:u shell3

    '已经连上网络'但无响应?检测与修复大攻略!

    1月前

    有很多的朋友,一直为链接上了网络,却上不了网, 这有很多种的原因。 一、网上邻居--属性--无线网络--右击--状态-- 选择支持  点击详情  查看 IP 、DNS是否与路由器上的 192.168.x.x对头。 二、

    为什么在校园网里,能登陆QQ,但浏览器就是不听话?

    1月前

    今天下午本来是打算来机房多看几篇博客顺便评论的,结果来了之后发现新装的win10系统说是激活失败,于是上网查了一个激活工具,然后下载下来激活(这个不是什么好的行为,大家一定要支持正版啊~),结果激活软件运行之后不仅系统没有激活成功,

    校园内网的双面人生:登录QQ轻而易举,网页却成了难题!

    1月前

    今天下午本来是打算来机房多看几篇博客顺便评论的,结果来了之后发现新装的win10系统说是激活失败,于是上网查了一个激活工具,然后下载下来激活(这个不是什么好的行为,大家一定要支持正版啊~),结果激活软件运行之后不仅系统没有激活成功,

    告别冗余元素:教你去除页眉横线与分页

    1月前

    删除页眉上的横线:双击页眉(或者点击插入–>页眉–>编辑页眉),进入页眉和页脚页面,选中页眉上的文字内容(一个单一的换行符也可以) 选中菜单栏中的设计菜单栏 单击页面边框,进入边框和底纹对话框

    解锁家庭娱乐新体验:轻松配置路由器与Adobe Flash Player

    1月前

    一、设备:买一个路由器,如TP-LINK(TL-R402M)90元左右,有一个WAN口和四个LAN口,另加上两条的两端都钳有水晶头的网线。 二、接法:把插到台式机的网线水晶头(另一端已接ADSL的)的接到路由器的WAN口上,用

    Adobe Flash Player的超实用技巧:SWF文件属性大揭秘

    23天前

    简介:本教程着重介绍如何查看和修改计算机操作系统中的文件属性,包括隐藏、只读、系统和存档等标志。文件属性对于控制文件可见性、可编辑性以及与其他系统组件的交互至关重要。通过本教程,用户可以学习如何有效地管理和保护自己的文件,例如设置文件

    深入Adobe Flash Player,掌握文件属性获取的高效策略

    23天前

    简介:文件属性对于IT领域的编程、系统管理和数据分析至关重要。本文详细介绍了在Windows、LinuxUnix、MacOS操作系统中,以及通过不同的编程语言和API获取文件属性的方法。涵盖了文件的常规属性如大小、日期、权限和元数据

    笔记本连无线网怎么都失败?实用攻略来帮你!

    20天前

    笔记本无线网络连接不上的解决方法 第一步:应检查无线网卡的驱动是否安装正确。右键点击“我的电脑”-属性-硬件-设备管理器,查看是否存在标有问号或叹号的网络设备,如果有,则说明无线网卡驱动安装不正确。使用金山卫士的“硬件检测”功

    IEXPLORE主页被更改,Adobe Flash Player导致?这样做恢复它!

    19天前

    假如你的首页被修改后是1.打开internet属性,把首页改回。2.右键点击快速启动栏上的IE图标,选择 属性,将"C:Program FilesInternet Exploreriexplore.e

    如何查找特定IP地址_怎么进去特定的ip地址

    12天前

    存储和查询指定范围的IP地址 一、将IP地址转化为数字 1.使用MySQL内置函数 我试着使用位移位将IP地址值转换为整数。MySQL有执行这些转换的内置函数。我以前从来没有听说过这些活动,所以我想我可以玩一玩

    JavaCard Object删除及垃圾回收设计_jcsystem.requestobjectdeletion()

    11天前

    --by Caesar 对象的存储: 对象以Heap的方式统一管理,ref以索引方式读取定长的Heap头。 永久对象:HeapBody存储在NVM中,并以TLV的方式连接。Heap头存储指向HeapBody的偏

    桌面图标下面的阴影怎么去掉

    11天前

    电脑|属性|高级|性能项的 设置|自定义|在桌面上为图标标签使用阴影|打上勾|如果不行,再在桌面空白处右击|排列图标|在桌面上锁定web项目|把勾去掉可以尝试以下4种方法:1.右击“我的电脑”,依次

    网站打不开怎么办,收藏以备不时之需_有的网站打不开怎么设置打开

    10天前

    DNS设置示范教程 部分地区有使用移动网络的小伙伴们吐槽无法访问部分网站的情况,同样的网站,使用电信和联通的用户就能正常访问。 这其实有很大几率是由于运营商的网络问题导致的,容易出现网站打不开的结果。 DNS

    【C++STL基础入门】list的增、删_c++ list删除指定元素

    9天前

    前言 在C++中,STL(Standard Template Library)是一个功能强大且常用的程序库,它为我们提供了许多容器和算法,使得编写高效且可维护的代码变得更加容易。其中,list是STL中的一个双向链表容器,它可

    发表评论

    全部评论 0
    暂无评论