Web前端新手应该知道的CSS长度单位

html-css06

Web前端新手应该知道的CSS长度单位,第1张

今天小编要跟大家分享的文章是关于Web前端新手应该知道的CSS长度单位!众所周知CSS技术我们虽然很熟悉,在使用的过程却很容易被困住,这让我们在新问题出现的时候变得很不利。随着web继续不断地发展,对于新技术新解决方案的要求也会不断增长。

因此,作为网页设计师和前端开发人员,我们别无选择,必须熟悉我们手上的工具,做到知己知彼,这样才能百战不殆。为了帮助大家更好的工作小编今天为大家分享一些css的长度单位,希望能够对小伙伴们有所帮助。

1、rem

我们首先介绍下和我们熟悉的很相似的货。em

被定义为相对于当前对象内文本的字体大小。炒个栗子,如果你给body小哥设置了font-size字体大小,那么body小哥的任何子元素的1em就是等于body设置的font-size。

Test

body{

font-size:14px

}

div{

font-size:1.2em

//calculatedat14px

*1.2,or16.8px

}

你看,这里div这娃的字体大小是1.2em。解释来说,就是他从body爹爹那里继承的字体大小(这里是14px)的1.2倍,结果就是16.8px。

但是,如果你用em一层一层级联得定义嵌套元素的字体大小又会花生什么事情呢?在下面这一小段代码里我们应用了和上面一样一样的CSS,每一个div都从它上一级父元素继承了字体大小,并且逐渐得增加。

Test

Test

Test

虽然在某些地方这正是我们想要的,但是通常情况下我们还是希望就依赖单一的相对度量单位就好。这时候嘛,我们就可以使用rem

了。‘r’是“root”的缩写,意思就是1rem等于根元素的字体大小大部分情况下,根元素就是元素了。

html{

font-size:14px

}div{

font-size:1.2rem

}

这样在上面的那三个嵌套的div娃们的字体大小都是1.2*14px=16.8px了。

2、适用于网格布局

Rems

不仅仅只是在设置字体大小上很方便。再炒个栗子,你可以用基于html根元素字体大小的rem作为整个网格布局或者UI库的大小单位,然后在其他特定的地方用em单位。这样将会给你带来更多的字体大小和伸缩的可控性,

.container{

width:70rem

//70*14px=980px}

概念上来说,这个方法的思想就是让你的界面根据你的内容进行缩放。但是,这样做并不是对所有的情况都有意义。

3、vhandvw

响应式Web设计离不开百分比。但是,CSS百分比并不是所有的问题的最佳解决方案。CSS的宽度是相对于包含它的最近的父元素的宽度的。但是如果你就想用视口(viewpoint)的宽度或者高度,而不是父元素的,那该肿么办?这就是

vh和vw单位为我们提供的。

1vh等于1/100的视口高度。栗子:浏览器高度900px,1vh=900px/100=9px。同理,如果视口宽度未750,1vw

=750px/100=7.5px。

可以想象到的,他们有很多很多的用途。比如,我们用很简单的方法只用一行CSS代码就实现同屏幕等高的框。

.slide{

height:100vh

}

假设你要来一个和屏幕同宽的标题,你只要设置这个标题的font-size的单位为vm,那标题的字体大小就会自动根据浏览器的宽度进行缩放,以达到字体和viewport大小同步的效果,有木有?!

4、vminandvmax

vh和vm依据于视口的高度和宽度,相对的,vmin和

vmax则关于视口高度和宽度两者的最小或者最大值。比如,浏览器的宽度设置为1100px,高度设置为700px,1vmin=1px,1vmax=

11px。

如果宽度设置为800px,高度设置为1080px,1vmin就等于8px,1vmax则未10.8px。

那么问题来了,我们应该在什么场景下使用这两个单位呢?

假设有一个元素,你需要让它始终在屏幕上可见。

只要对其高度和宽度使用vmin单位,并赋予其低于100的值就可以做到了。再来个栗子,可以这样定义一个至少有两个边触摸到屏幕的方形:

.box{

height:100vmin

width:100vmin

如果你要让这个方形框框始终铺满整个视口的可见区域(四边始终触摸到屏幕的四边)

.box{

height:100vmax

width:100vmax

}

结合使用这些单位可以为我们提供一个新颖有意思的方式来灵活地利用我们视口的大小。

5、exandch

ex和ch单位,类似于em和rem,依赖于当前的字体和字体大小。但是,不同的是,这两货是基于字体的度量单位,依赖于设定的字体。

ch单位通常被定义为数字0的宽度。你可以在Eric

Meyers的博客里找到关于它的一些有意思的讨论,例如将一个等宽字体的字母”N”的宽度设置为40ch,那么在另一种类型的字体里它却可以包含40个字母。

这个单位的传统用途主要是盲文的排版,但是除此之外,肯定还有可以应用他的地方。

ex定义为当前字体的小写x字母的高度或者1/2的1em。很多时候,它是字体的中间标志。

x-heighttheheightofthelowercasex

这些单位有很多用途,大部分用于版式的微调。比方说,sup元素(上角文字标),可以通过position:relativebottom:1ex实现

类似的方法,你可以实现一个下角文字标。浏览器默认的方式是利用

上标和下标特定垂直对齐规则,但是如果你想更细粒度更精确得控制,你可以像下面这样做:

sup{

position:relative

bottom:1ex

}

sub{

position:relative

bottom:-1ex

}

结论

持续关注不断发展壮大的CSS技术无疑是很重要的,这样你才能掌握你所持有的工具的全部技能。说不定将来你遇到的某个特殊的问题就需要使用这些复杂的单位来解决。

以上就是小编今天为大家分享的额关于Web前端新手应该知道的CSS长度单位的文章,希望本篇文章能够对正在从事web前端工作和喜欢web前端技术的小伙伴们有所帮助。想要了解更多web前端相关知识记得关注北大青鸟web培训官网。最后祝愿小伙伴们工作顺利!

语法:find_element_by_css_selector("css选择器定位策略”) 或者 find_elements_by_css_selector("css选择器定位策略”)

1、css可以通过元素的 id,class,标签 这三个常规属性直接定位到

tips:若用id定位,则用 #。若用class定位,则用 .

下面是百度搜索框的HTML代码:

通过css selector定位有如下三种常规方式:

  find_element_by_selector("#kw") (#表示通过id定位)

find_element_by_selector(".s_ipt") (. 表示通过class定位)

find_element_by_selector("标签名“”) 其实单纯通过标签名来定位元素,是有很大局限性的,因为一个页面中,非常大可能的

存在标签名的重复,因此无法很精确的定位

这个我是复制的 你试试可以不

出现这个现象有方面的,一是硬件,即内存方面有问题,二是软件,这就有多方面的问题了。

一:先说说硬件:

一般来说,电脑硬件是很不容易坏的。内存出现问题的可能性并不大(除非你的内存真的是杂牌的一塌徒地),主要方面是:

1。内存条坏了(二手内存情况居多)、2。使用了有质量问题的内存,3。内存插在主板上的金手指部分灰尘太多。

4。使用不同品牌不同容量的内存,从而出现不兼容的情况。5。超频带来的散热问题。你可以使用MemTest 这个软件来检测一下内存,

它可以彻底的检测出内存的稳定度。

二、如果都没有,那就从软件方面排除故障了。

先说原理:内存有个存放数据的地方叫缓冲区,当程序把数据放在缓冲区,需要操作系统提供的“功能函数”来申请,如果内存分配成功,

函数就会将所新开辟的内存区地址返回给应用程序,应用程序就可以通过这个地址使用这块内存。这就是“动态内存分配”,

内存地址也就是编程中的“光标”。内存不是永远都招之即来、用之不尽的,有时候内存分配也会失败。当分配失败时系统函数会返回

一个0值,这时返回值“0”已不表示新启用的光标,而是系统向应用程序发出的一个通知,告知出现了错误。作为应用程序,

在每一次申请内存后都应该检查返回值是否为0,如果是,则意味着出现了故障,应该采取一些措施挽救,这就增强了程序的“健壮性”。

若应用程序没有检查这个错误,它就会按照“思维惯性”认为这个值是给它分配的可用光标,继续在之后的执行中使用这块内存。

真正的0地址内存区储存的是计算机系统中最重要的“中断描述符表”,绝对不允许应用程序使用。在没有保护机制的操作系统下(如DOS),

写数据到这个地址会导致立即当机,而在健壮的操作系统中,如Windows等,这个操作会马上被系统的保护机制捕获,

其结果就是由操作系统强行关闭出错的应用程序,以防止其错误扩大。这时候,就会出现上述的内存不能为“read”错误,

并指出被引用的内存地址为“0x00000000“。内存分配失败故障的原因很多,内存不够、系统函数的版本不匹配等都可能有影响。

因此,这种分配失败多见于操作系统使用很长时间后,安装了多种应用程序(包括无意中“安装”的病毒程序),更改了大量的系统参数和

系统档案之后。在使用动态分配的应用程序中,有时会有这样的情况出现:程序试图读写一块“应该可用”的内存,但不知为什么,

这个预料中可用的光标已经失效了。有可能是“忘记了”向操作系统要求分配,也可能是程序自己在某个时候已经注销了这块内存而

“没有留意”等等。注销了的内存被系统回收,其访问权已经不属于该应用程序,因此读写操作也同样会触发系统的保护机制,企图

“违法”的程序唯一的下场就是被操作终止执行,回收全部资源。计算机世界的法律还是要比人类有效和严厉得多啊!像这样的情况都属

于程序自身的BUG,你往往可在特定的操作顺序下重现错误。无效光标不一定总是0,因此错误提示中的内存地址也不一定为“0x00000000”,

而是其它随机数字。

首先建议:

1、 检查系统中是否有木马或病毒。这类程序为了控制系统往往不负责任地修改系统,从而导致操作系统异常。平常应加强信息安全意识,

对来源不明的可执行程序绝不好奇。

2、 更新操作系统,让操作系统的安装程序重新拷贝正确版本的系统档案、修正系统参数。有时候操作系统本身也会有BUG,要注意安装官

方发行的升级程序。

3、 尽量使用最新正式版本的应用程序、Beta版、试用版都会有BUG。

4、 删除然后重新创建 Winnt\System32\Wbem\Repository 文件夹中的文件:在桌面上右击我的电脑,然后单击管理。在"服务和应用程序

"下,单击服务,然后关闭并停止 Windows Management Instrumentation 服务。 删除 Winnt\System32\Wbem\Repository 文件夹中的所有

文件。(在删除前请创建这些文件的备份副本。) 打开"服务和应用程序",单击服务,然后打开并启动

Windows Management Instrumentation 服务。当服务重新启动时,将基于以下注册表项中所提供的信息重新创建这些文件:

HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\WBEM\CIMOM\Autorecover MOFs

下面搜集几个例子给大家分析:

例一:IE浏览器出现“0x0a8ba9ef”指令引用的“0x03713644” 内存,或者“0x70dcf39f”指令引用的“0x00000000”内存。

该内存不能为“read”。要终止程序,请单击“确定”的信息框,单击“确定”后,又出现“发生内部错误,您正在使用的其中

一个窗口即将关闭”的信息框,关闭该提示信息后,IE浏览器也被关闭。解决方法:

1、 开始-运行窗口,输入“regsvr32 actxprxy.dll”回车,接着会出现一个信息对话 框“DllRegisterServer in actxprxy.dll succeeded”,确定。再依次运行以下命令。

(这个方法有人说没必要,但重新注册一下那些.dll对系统也没有坏处,反正多方下手,能解决问题就行。)

regsvr32 shdocvw.dll

regsvr32 oleaut32.dll

regsvr32 actxprxy.dll

regsvr32 mshtml.dll

regsvr32 msjava.dll

regsvr32 browseui.dll

regsvr32 urlmon.dll

2、 修复或升级IE浏览器,同时打上系统补丁。看过其中一个修复方法是,把系统还原到系统初始的状态下。建议将IE升级到了6.0。

例二:有些应用程序错误: “0x7cd64998” 指令参考的 “0x14c96730” 内存。该内存不能为 “read”。解决方法:Win XP的“预读取”

技术这种最佳化技术也被用到了应用程序上,系统对每一个应用程序的前几次启动情况进行分析,然后新增一个描述套用需求的虚拟

“内存映像”,并把这些信息储存到Windows\Prefetch文件夹。一旦建立了映像,应用软件的装入速度大大提高。XP的预读取数据储存

了最近8次系统启动或应用软件启动的信息。建议将虚拟内存撤换,删除Windows\Prefetch目录下所有*.PF文件,让windows重新收集程序

的物理地址。

例三:在XP下双击光盘里面的“AutoRun.exe”文件,显示“0x77f745cc”指令引用的“0x00000078”内存。该内存不能为“written”,

要终止程序,请单击“确定”,而在Windows 98里运行却正常。 解决方法:这可能是系统的兼容性问题,winXP的系统,右键

“AutoRun.exe”文件,属性,兼容性,把“用兼容模式运行这个程序”项选择上,并选择“Windows 98/Me”。win2000如果打了SP的

补丁后,只要开始,运行,输入:regsvr32 c:\winnt\apppatch\slayerui.dll。右键,属性,也会出现兼容性的选项。

例四:RealOne Gold关闭时出现错误,以前一直使用正常,最近却在每次关闭时出现“0xffffffff”指令引用的“0xffffffff”内存。

该内存不能为“read” 的提示。 解决方法:当使用的输入法为微软拼音输入法2003,并且隐藏语言栏时(不隐藏时没问题)关闭RealOne

就会出现这个问题,因此在关闭RealOne之前可以显示语言栏或者将任意其他输入法作为当前输入法来解决这个问题。

例五:我的豪杰超级解霸自从上网后就不能播放了,每次都提示“0x060692f6”(每次变化)指令引用的“0xff000011”内存不能为

“read”,终止程序请按确定。 解决方法:试试重装豪杰超级解霸,如果重装后还会,到官方网站下载相应版本的补丁试试。还不行,

只好换就用别的播放器试试了。

例六:双击一个游戏的快捷方式,“0x77f5cd0”指令引用“0xffffffff”内存,该内存不能为“read” ,并且提示Client.dat程序错误。

解决方法:重装显卡的最新驱动程序,然后下载并且安装DirectX9.0。

例七:一个朋友发信息过来,我的电脑便出现了错误信息:“0x772b548f”指令引用的“0x00303033”内存,该内存不能为“written”,

然后QQ自动下线,而再打开QQ,发现了他发过来的十几条的信息。解决方法:这是对方利用QQ的BUG,发送特殊的代码,做QQ出错,

只要打上补丁或升级到最新版本,就没事了。

该内存不能为read或written的解决方案关键词:该内存不能为"read" 该内存不能为"written"

从网上搜索来的几篇相关文章.

【文章一】

使用Windows操作系统的人有时会遇到这样的错误信息:

「“0X????????”指令引用的“0x00000000”内存,该内存不能为“read”或“written”」,然后应用程序被关闭。

如果去请教一些「高手」,得到的回答往往是「Windows就是这样不稳定」之类的义愤和不屑。其实,这个错误并不一定是Windows

不稳定造成的。本文就来简单分析这种错误的一般原因。

一、应用程序没有检查内存分配失败

程序需要一块内存用以储存数据时,就需要使用操作系统提供的「功能函数」来申请,如果内存分配成功,函数就会将所新开辟的

内存区地址返回给应用程序,应用程序就可以通过这个地址使用这块内存。这就是「动态内存分配」,内存地址也就是编程中的「光标」。

内存不是永远都招之即来、用之不尽的,有时候内存分配也会失败。当分配失败时系统函数会返回一个0值,这时返回值「0」已

不表示新启用的游标,而是系统向应用程序发出的一个通知,告知出现了错误。作为应用程序,在每一次申请内存后都应该检查返回值

是否为0,如果是,则意味着出现了故障,应该采取一些措施挽救,这就增强了程序的「健壮性」。若应用程序没有检查这个错误,

它就会按照「思维惯性」认为这个值是给它分配的可用游标,继续在之后的执行中使用这块内存。真正的0地址内存区储存的是计算机

系统中最重要的「中断描述符表」,绝对不允许应用程序使用。在没有保护机制的操作系统下(如DOS),写数据到这个地址会导致立即当机,

而在健壮的操作系统中,如Windows等,这个操作会马上被系统的保护机制捕获,其结果就是由操作系统强行关闭出错的应用程序,

以防止其错误扩大。这时候,就会出现上述的「写内存」错误,并指出被引用的内存地址为「0x00000000」。内存分配失败故障的原因很多,

内存不够、系统函数的版本不匹配等都可能有影响。因此,这种分配失败多见于操作系统使用很长时间后,安装了多种应用程序(包括无意中

「安装」的病毒程序),更改了大量的系统参数和系统档案之后。

二、应用程序由于自身BUG引用了不正常的内存光标

在使用动态分配的应用程序中,有时会有这样的情况出现:程序试突读写一块「应该可用」的内存,但不知为什么,这个预料中可用的

光标已经失效了。有可能是「忘记了」向操作系统要求分配,也可能是程序自己在某个时候已经注销了这块内存而「没有留意」等等。

注销了的内存被系统回收,其访问权已经不属于该应用程序,因此读写操作也同样会触发系统的保护机制,企图「违法」的程序唯一的

下场就是被操作终止执行,回收全部资源。计算机世界的法律还是要比人类有效和严厉得多啊!像这样的情况都属于程序自身的BUG,

你往往可在特定的操作顺序下重现错误。无效光标不一定总是0,因此错误提示中的内存地址也不一定为「0x00000000」,而是其它随机数

字。如果系统经常有所提到的错误提示,下面的建议可能会有说明 :

1.检视系统中是否有木马或病毒。这类程序为了控制系统往往不负责任地修改系统,

从而导致操作系统异常。平常应加强信息安全意识,对来源不明的可执行程序绝不好奇。

2.更新操作系统,让操作系统的安装程序重新拷贝正确版本的系统档案、修正系统参数。

有时候操作系统本身也会有BUG,要注意安装官方发行的升级程序。

3.试用新版本的应用程序。

Mode:

将虚拟内存撤换

答案:

目前为止是肯定的,也就是如在下次冷天到来时亦没再发生,就代表这是主因

追加:

如果你用 Ghost 恢复 OS 后建议 删除WINDOWS\PREFETCH目录下所有*.PF文件因为需让windows重新收集程序的物理地址

有些应用程序错误 "0x7cd64998" 指令参考的 "0x14c96730" 内存。该内存不能为 "read"推论是此原因

源由:

Win XP的「预读取」技术

这种最佳化技术也被用到了应用软件上,系统对每一个应用软件的前几次启动情况进行分析,然后新增一个描述套用需求的虚

拟「内存映像」,并把这些信息储存到WINDOWSPREFETCH数据夹。一旦建立了映像,应用软件的装入速度大大提高。XP的预读取数

据储存了最近8次系统启动或应用软件启动的信息。

【原因 解决方法】

1 内存条坏了 更换内存条

2 双内存不兼容 使用同品牌的内存或只要一条内存

3 内存质量问题 更换内存条

4 散热问题 加强机箱内部的散热

5 内存和主板没插好或其他硬件不兼容 重插内存或换个插槽

6 硬件有问题 更换硬盘

7 驱动问题 重装驱动,如果是新系统,应先安装主板驱动

8 软件损坏 重装软件

9 软件有BUG 打补丁或更新到最新版本

10 软件和系统不兼容 给软件打上补丁或是试试系统的兼容模式

11 软件和软件之间有冲突 如果最近安装了什么新软件,卸载了试试

12 软件要使用其他相关的软件有问题 重装相关软件,比如播放某一格式的文件时出错,可能是这个文件的解码器有问题

13 病毒问题 杀毒

14 杀毒软件与系统或软件相冲突 由于杀毒软件是进入底层监控系统的,可能与一些软件相冲突,卸载试试

15 系统本身有问题 有时候操作系统本身也会有BUG,要注意安装官方发行的更新程序,象SP的补丁,最好打上.如果还不行,重装系统,

或更换其他版本的系统。

〔又一说〕

在控制面板的添加/删除程序中看看你是否安装了微软NET.Framework,如果已经安装了,可以考虑卸载它,当然如果你以后在其它程序

需要NET.Framework时候,可以再重新安装。

另外,如果你用的是ATI显卡并且你用的是SP2的补丁(一些ATI的显卡驱动需要在NET.Framework正常工作的环境下)。这种情况你可以

找一款不需要NET.Framework支持的ATI显卡驱动。

如果以上两种方法并不能完全解决问题,你试着用一下“IE修复”软件,并可以查查是否有病毒之类的。

〔微软NET.Framework升级到1.1版应该没问题了〕

〔还有一说〕

方法一:

微软新闻组的朋友指点:开始--运行:regsvr32 jscript.dll

开始--运行:regsvr32 vbscript.dll

不过没解决---但提供了路子-----一次运行注册所有dll

搜索查找到方法如下:

运行 输入cmd 回车在命令提示符下输入

for %1 in (%windir%\system32\*.dll) do regsvr32.exe /s %1

这个命令老兄你慢慢输 输入正确的话会看到飞快地滚屏 否则……否则失败就是没这效果。回车后慢慢等(需要点时间1-2分钟)

都运行完再打开看

方法二:

这是个典型问题~~~~~引起这个问题的原因很多。一般来讲就是给系统打上补丁和更换内存、给内存换个插槽这3种方法来解决。

[系统补丁只要到Microsoft Update网站在线更新就可以了]

造成这种问题的原因很多,不能单纯的下结论,尽量做到以下几点可能对你有帮助:

1。确保使用的是未修改过的软件(非汉化、破解版)

2。使用改软件时尽量不要运行其他软件。(这是个临时文件,可能某些软件也在使用临时文件夹,所以产生干扰)

3。把那些什么桌面工具,内存整理工具通通关掉(你至少有2个类似的工具在运行)”

处理方法:

运行regedit进入注册表, 在HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\Explorer\ShellExecuteHooks下,

应该只有一个正常的键值"{AEB6717E-7E19-11d0-97EE-00C04FD91972}, 将其他的删除。

〔我个人的最后解决和看法〕

我今天尝试了多种办法,最后我发现问题出在微软的NET.Framework上面。我升级了这个软件,并打齐了补丁,短暂平安后,有出现

“内存不能为read”的情况。后来我受上面文章的启发,卸载了微软的NET.Framework1.0和1.1,世界太平了。

另外:如果是打开“我的电脑”、“我的文档”等的时候出现上述情况,还有一种可能,就是你的右键菜单太臃肿了,此时只要清理

右键菜单问题就解决了。