css reset(请问在CSS中reset browser defaults是什么意思)
本文目录
- 请问在CSS中reset browser defaults是什么意思
- 描述一个“reset“的CSS文件并如何使用它知道normalize.css吗
- 在网站的css开发中,第一时间都先吧css reset 写上,这是为什么
- Normalize.css 和 Reset CSS 有什么本质区别没
- 到底该不该用 CSS reset
- css reset 以及哪些元素有默认margin padding值
- 如何查看一个网站的CSS RESET
- 如何让某一元素内的内容不被reset.css重置
请问在CSS中reset browser defaults是什么意思
就是将网页中所有可能用上的块级元素进行重定义 。。 去掉浏览器默认赋予的margin和padding的值以及定义其他的声明 。。、比如:body,p,div,h1,h3,h3,h4,h5,h6,form,legend,code,fieldset,cite,blockquote,ul,ol,li,dl,dt,dd{margin:0; padding:0; font-family:Arial, Tahoma, San Serif}行级元素比如锚点a,粗体stong等等是不需要reset的 。。
描述一个“reset“的CSS文件并如何使用它知道normalize.css吗
重置样式非常多,凡是一个前端开发人员肯定有一个常用的重置CSS文件并知道如何使用它们。他们是盲目的在做还是知道为什么这么做呢?原因是不同的浏览器对一些元素有不同的默认样式,如果你不处理,在不同的浏览器下会存在必要的风险,或者更有戏剧性的性发生。 你可能会用Normalize来代替你的重置样式文件。它没有重置所有的样式风格,但仅提供了一套合理的默认样式值。既能让众多浏览器达到一致和合理,但又不扰乱其他的东西(如粗体的标题)。 在这一方面,无法做每一个复位重置。它也确实有些超过一个重置,它处理了你永远都不用考虑的怪癖,像HTML的audio元素不一致或line-height不一致。 以上内容均来自传智播客社区
在网站的css开发中,第一时间都先吧css reset 写上,这是为什么
因为不同的浏览器默认的css不同,为了统一所有浏览器的展示效果。比如IE6,7的body的margin值,与谷歌浏览器等标准浏览器的margin是不同的。
Normalize.css 和 Reset CSS 有什么本质区别没
最主要的区别是Normalize.css保留不同浏览器同标签相同的默认值,只重置不同默认样式的差异,可以说css reset的高级版。相对于普通的css reset,Normalize的的浏览器的兼容性更好,毕竟是专业人士经过不同版本浏览器测试打造的css文件,看看它的兼容性就知道多强悍:支持的浏览器:Google Chrome (latest)Mozilla Firefox (latest)Mozilla Firefox ESROpera (latest)Apple Safari 6+Internet Explorer 8+
到底该不该用 CSS reset
最初出现 CSS reset 的目的是解决浏览器在默认样式上的诸多差异和问题。而现代浏览器在这方面的差异已经小了很多,所以 CSS reset 的必要性就不那么高了。另一方面,滥用 CSS reset 导致一些问题:1. 不当的破坏了所有浏览器的基本样式。最典型的混蛋做法就是将所有元素的margin/padding设为0,及去掉ol/ul的列表样式,去掉h1~h6的字体大小样式。这导致blockquote、ol、ul、hn等语义元素在没有赋以其他合理的样式时(常常如此),缺乏恰当的样式展现。而因为视觉上无法区分,这进一步导致许多开发人员忽视或误用这些语义元素,并严重破坏团队内其他希望使用语义元素的开发人员的工作流程。2. 浏览器为配合控件风格,或出于可用性和无障碍性考虑,会有一些特定的默认样式。如一些浏览器对于 input 默认有 margin,以确保单选框的外观比较协调。粗暴的reset导致控件外观可能在特定浏览器下失调。又如大部分交互控件在获得焦点时有虚线outline。去掉这样式而又不提供其他对于焦点的视觉反馈机制(常常如此)可能导致可用性和无障碍性问题。3. 某些use case中,网页中有有一些较高独立性的部分,比如内嵌器、widget、第三方内容等,CSS reset导致这部分的样式常需要完全重新覆写,而这种覆写本来可能大部分是不必要的,令人烦躁且可能遗漏。参考此问答:怎样不让 CSS reset 样式覆盖掉器内的文章样式?4. CSS reset 通常会增加浏览器进行样式计算的成本(即有一定的性能负担),因为它引入了许多的针对元素的全局规则,网页中几乎所有元素都会匹配一条乃至几条的reset规则,且往往规则中的属性设定其实会被更specific的规则所覆盖(比如padding和margin)。极端情况下,可能某条reset规则中的所有属性设置实际上并没有在任何元素上生效(因为全部被更specific的规则给覆盖了),所有针对此规则的级联计算全都是浪费。注意一点,导致这些问题共通的本质性因素是:CSS reset 的作用是全局性的(即缺乏选择器限定范围)。所有合格的程序员都知道避免滥用全局变量,但是在 CSS 上他们就忘记了这一点。因此,除了上述4点所提到的问题,从可维护性上来看,所有全局变量可能导致的维护性噩梦也会以类似的方式发生在 CSS reset 上。比如一旦引入了 CSS reset,当项目规模大到一定程度,要再想把 CSS reset 从项目中去掉,就十分困难。解决方法:1. 不使用 CSS reset,或使用那些谨慎的,只是用来消除浏览器默认样式不一致的真正的 CSS reset(更准确的称谓或许是 CSS normalize,参考此问答:Normalize.css 与传统的 CSS Reset 有哪些区别?)。2. 对于特定的reset需求,只在真正需要的时候,单独设置。若要提高代码复用程度,可以引入CSS预处理,以mixin来做。例子:@mixin reset-box() { list-style: none padding: 0 margin: 0}@mixin reset-font() { font-size: 1em font-weight: normal font-style: normal}//真正用的场景html#示例网站 { nav#全站导航条 ul { border: 1px solid +reset-box() } section.侧栏模块 { border: 1px solid h1 { background: navy color: white border-bottom: 1px solid +reset-box() +reset-font() } }}(以上以伪代码书写,请自行脑补转换为 SASS/Stylus/LESS 等。)3. 对于已经使用 CSS reset 的同学,可以籍由支持局部 import 的 CSS 预处理器(比如 stylus)的帮助,从限定其在特定 selector 之下开始,逐步控制其影响范围。如:html#示例网站 { ... // 不依赖 CSS reset 的部分 .legacy-part { // 页面中仍依赖 CSS reset 的部分 @import ’reset.css’ }}最后顺带说下,CSS 3 已加入 unset 关键字和 all 快捷属性(目前仅 Firefox 支持),可以更好的支持必要的 reset 需求。以上。补充:有些同学认为“没有那种很傻叉的重置的话,我觉得都算不上是滥用”。问题在于,怎么样算是“傻叉重置”?团队里的每个人对此认识一致吗?将来新人进入老人离开,还能保持对此认识一致吗?除了非常明确的使用 normalize.css 之类的既定方案的情况,许多团队常见自行 customize 一个 reset.css 或混合了 reset 的 base.css。这种情况下,随着时间流逝最可能出现的情形就是此 css 会逐渐混入了更多的全局性的样式(因为合格的程序员都有增强复用性的冲动),从而陷入之前说的那些问题。因此,未雨绸缪的做法,就是一开始就避免使用 CSS reset,或严格明确和限定其作用(如 normalize 的方式)。
css reset 以及哪些元素有默认margin padding值
常用元素的padding、margin值如下:1、body 水平垂直方向默认有 10px 的 margin 值;2、p,ul,ol,dl 标签垂直方向默认有 20px 的 margin 值,且这几个标签之间 20px 间距不重复;3、dd 标签在水平方向默认有 40px 的 margin 值;4、ul,ol 标签水平方向默认有 40px 的 padding 值(ie6/7下无)。
如何查看一个网站的CSS RESET
reset一般就是重置样式文件而已。css的样式不会很多的。
在F12里面,样式的后面会有显示是属于什么文件的样式。
望采纳
如何让某一元素内的内容不被reset.css重置
css是后设置的会覆盖前面设置的;比如在样式重置里规范lili{list-style:none;}//取消li前面的原点,在style.css里在定义一次li就取消了样式重置li{list-style:circle;}
更多文章:
java面试问到项目难点(java面试失败,没有公司经验,培训完做过两个项目,请教大家有啥建议)
2024年7月15日 17:39
八进制 57的二进制反码(求37 、-37、57、-57的原码反码补码(8位表示))
2024年6月14日 07:40
电脑出现harderror(电脑开机时出现“Unknown Hard Error”怎么解决)
2024年7月19日 04:31
oracle循环执行sql(Oracle SQL文for循环执行,每一次WHERE IN 条件不同,为什么时慢时快哪位大神来帮忙下)
2024年8月25日 10:05
preserve和conserve区别(Conserve , preserve, reserve意思相近,但区别是什么)
2024年6月23日 01:47
我还需要背许多的魔方公式英文((分)魔方公式的那些英文啥意思先打个比如:六面回字公式 U’D F’B L R’U’D 等)
2024年7月12日 00:20
flash怎么做鼠标跟随(Flash教你如何制作火苗跟随鼠标)
2024年8月13日 03:45
spring festival范文五句话(春节英语作文5句话小学怎么写)
2024年6月21日 13:34
e为底的指数函数积分(关于以e为底的指数函数和三角函数乘积的定积分 0分拜托了各位 谢谢)
2024年7月23日 14:44