为什么要重置body等元素的样式

最新推荐文章于 2021-11-09 18:37:01 发布
最新推荐文章于 2021-11-09 18:37:01 发布
阅读量414 收藏
点赞数 1
分类专栏： JAVASCRIPT CSS HTML
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/jerny2017/article/details/80197032
版权
JAVASCRIPT 同时被 3 个专栏收录
24 篇文章 0 订阅
订阅专栏
CSS
23 篇文章 0 订阅
订阅专栏
HTML
17 篇文章 0 订阅
订阅专栏

不同浏览器body的margin值会不一样，也就是body到html的距离不一样，比如：

IE8+，Chrome， Firefox等是8px

IE7，margin-left是10px, margin-top是15px

这些差异会使得dom中的一些属性值不一样，比如offsetLeft，offsetTop

所以为了解决这些兼容问题，一般情况下，会在样式表中重置body等元素的margin，padding值为0

jerny2017
关注
专栏目录
重置CSS样式
weixin_45650998的博客
09-02 1677
CSS 重置样式主要就是为了让各个浏览器的css样式有一个统一的基准。我们可以通过重置样式，把浏览器的默认样式全部去掉，然后设置一个统一的标准。这样我们的网页在不同的浏览器下显示的效果就是一个的了。官方：Normalize.css是一个很小的CSS文件，它默认的HTML元素样式上提供了跨浏览器的高度一致性，相比传统的CSS reset，Normalize.css是一种现代的、为HTML5准备的优质替代方案。作用：统一了不同浏览器的默认样式，同时保留了一些有用的默认值。方式一：reset.css。
2 HTML中的body和它的默认样式
weixin_34320724的博客
05-25 2602
大家好，我是小遁。 body有默认的margin值 在上节课的代码中加入<div>Hello World</div> <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content=...
CSS样式重写.css
04-20
CSS样式重写.cssCSS样式重写.cssCSS样式重写.cssCSS样式重写.cssCSS样式重写.cssCSS样式重写.css
CSS reset重置样式有那么重要吗？
weixin_34194359的博客
09-13 139
在以前写html代码的时候，一般都会在head里添加重置样式reset.css，其内容如下： @charset "utf-8"; html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, ...
css重置样式
qq_41637614的博客
01-26 1669
/* * @Author: Marte * @Date:   2018-01-26 10:12:31 * @Last Modified by:   Marte * @Last Modified time: 2018-01-26 10:37:43 */ /** 清除内外边距 **/ body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /*
关于css重置样式
smile的博客
01-13 783
CSS样式表的初始化，全局样式设置。部分样式属性请根据具体页面重置其属性  body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select{margin:0;padding:0} body{font:12px "宋体","Arial Narrow",HELVETICA;b
html格式化body,重新格式化HTML
weixin_39625337的博客
06-07 232
Eron，这是惊人的有多少人认为通过删除返回和制表符可以节省大量的文件大小和加载时间。确实，你确实可以节省一些......但它与去奥运会游泳池的浴室的效果差不多，即不多。作为一个用户界面的人，我很迷恋在后端正确缩进我的代码。它可以更容易地发现问题并快速解决问题。为此，在我最近的工作中，我一直在无情地窃取一个文件中的丑陋代码，手动格式化(添加中断和制表符)。这并不快，绝对不好玩。但最终的代码看起来不...
重置浏览器默认样式
09-25
这样可以精确地控制每个元素的样式，避免影响那些不应重置的元素，如`form`元素、`input`元素、`textarea`等，这些元素可能需要保留其默认的样式以便正常工作。 除了内边距和外边距，还需要关注其他可能导致样式...
css reset 重置样式介绍
09-25
- 对表格、输入框、选择框、标签等元素进行统一的样式重置，如表格的边框合并，输入框的垂直居中对齐等。 - 对于列表，有多种选择器，比如无样式列表（.nostyle）和内联样式列表（.inline-style）。 - 对于HTML5新增...
core-reset：一种CSS重置，可将所有元素简化为最基本的形式
02-04
在网页设计中，CSS（层叠样式表）是用于控制网页元素样式的重要工具。然而，不同的浏览器对默认样式处理存在差异，这可能导致在不同浏览器下页面显示不一致的问题。为了解决这一问题，开发者通常会使用CSS重置，如...
在js中修改html、body的样式
weixin_42289080的博客
11-09 1万+
一、原始定义 先在css中定义：body, html 宽高为300px body, html { width: 300px; height: 300px; } js操作，以修改宽度为例 // 获取body、html节点style（主要是这里html，一开始不清楚获取方式） let bodyStyle = document.body.style let htmlStyle = document.getElementsByTagName('html')[0].style // 获取浏览器的宽度
继承body元素的样式
qq_37499398的博客
05-15 1396
Inherit Styles from the Body Element现在我们证明了每一个 HTML 页面都有一个body 元素，并且其 body 元素同样能够应用样式。记住，你可以像对其他 HTML 元素一样对你的body 元素应用样式，并且所有其他元素将继承你的 body 元素的样式。首先，创建一个文字为 Hello World 的 h1 元素。然后，让我们通过向 body 元素的样式声明部...
CSS清除默认样式和一些快速引用的样式整理
HarryMing的技术分享
07-19 594
CSS清除默认样式代码： /*清除默认样式*/ html, body, div, ul, li, h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ol, form, input, textarea, th, td, select { margin: 0; padding: 0; } *{box-sizing: border-box;} html, bo...
HTML各个标签的默认样式,HTML的各个标签的默认样式
weixin_42615290的博客
06-18 1652
head{ display: none }body{ margin: 8px;line-height: 1.12 }button, textarea,input, object,select { display:inline-block;}ol, ul, dir,menu, dd{ margin-left: 40px }i, cite, em,var, address{ font-style: ...
css清除默认样式和设置公共样式
weixin_30776863的博客
01-08 304
/*公共样式--开始*/html, body, div, ul, li, h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ol, form, input, textarea, th, td, select { margin: 0; padding: 0;}*{box-sizing: border-box;}html, body { min-heigh...
HTML·设置body中内容居中
热门推荐
滴_的专栏
09-15 4万+
String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %> "> 扫描结果
html标签默认属性样式及浏览器默认样式
泠泠似水
09-12 5724
html,address,blockquote,body, dd, div,dl, dt, fieldset, form,frame, frameset,h1, h2,h3, h4,h5, h6, noframes,ol, p, ul, center,dir, hr, menu, pre { display: block}/*以上列表元素默认状态下以块状显示，未显示的将以内联元素显示，该列表针对HT
CSS浏览器样式重置与技巧全解析
文章首先提到，浏览器的默认样式可能并不符合设计需求，比如body元素的8px外边距，这通常需要通过`body{margin:0;}`来消除。 针对全屏布局的需求，作者指出设置`div{height:100%;}`不足以让整个页面充满屏幕，因为`...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值