重置浏览器的css,css重置浏览器默认样式
理念:1. reset
的目的不是清除浏览器的默认样式,这仅是部分工作。清除和重置是紧密不可分的。
2. reset
的目的不是让默认样式在所有浏览器下一致,而是减少默认样式有可能带来的问题。
3. reset
期望提供一套普适通用的基础样式。但没有银弹,推荐根据具体需求,裁剪和修改后再使用。
特色:1. 适应中文;2. 基于最新主流浏览器。
维护:玉伯, 正淳
Revision: 276
*/
body, h1, h2, h3, h4, h5, h6, hr, p,
blockquote,
dl, dt, dd, ul, ol, li,
pre,
form, fieldset, legend, button, input,
textarea,
th, td {
margin: 0;
padding: 0;
}
body,
button, input, select, textarea {
font: 12px/1.5 tahoma, arial, simsun,
sans-serif;
}
h1, h2, h3, h4, h5, h6 { font-size:
100%; }
address, cite, dfn, em, var {
font-style: normal; }
code, kbd, pre, samp {
font-family: courier new, courier, monospace; }
small { font-size: 12px; }
ul, ol { list-style: none; }
a { text-decoration: none; }
a:hover { text-decoration: underline;
}
sup { vertical-align: text-top; }
sub { vertical-align: text-bottom;
}
legend { color: #000; }
fieldset, img { border: 0; }
button, input, select, textarea {
font-size: 100%; }
table { border-collapse: collapse;
border-spacing: 0; }
1.性能差异
【border:0;】把border设为“0”像素虽然在页面上看不见,但按border默认值理解,浏览器依然对border-width/border-color进行了渲染,即已经占用了内存值。
【border:none;】把border设为“none”即没有,浏览器解析“none”时将不作出渲染动作,即不会消耗内存值。
2.兼容性差异
兼容性差异只针对浏览器IE6、IE7与标签button、input而言,在win、win7、vista
的XP主题下均会出现此情况。
【border:none;】当border为“none”时似乎对IE6/7无效边框依然存在
【border:0;】当border为“0”时,感觉比“none”更有效,所有浏览器都一致把边框隐藏
总结:
1.
对比border:0;与border:none;之间的区别在于有渲染和没渲染,感觉他们和display:none;与
visibility:hidden;的关系类似,而对于border属性的渲染性能对比暂时没找测试的方法,虽然认为他们存在渲染性能上的差异但也只能
说是理论上。
2.
如何让border:none;实现全兼容?只需要在同一选择符上添加背景属性即可,
对于border:0;与border:none;个人更向于使用,border:none;,因为border:none;毕竟在性能消耗没有争议,而且兼容性可用背景属性解决不足以成为障碍。
所以建议大家根据自己的实际情况做判断使用border:none; 或者
border:0;
重置浏览器的css,css重置浏览器默认样式相关推荐
- CSS之布局(默认样式)
默认样式: <!DOCTYPE html> <html><head><meta charset="UTF-8"><title& ...
- 取消chrome浏览器下input和textarea的默认样式
chrome浏览器下的input和textarea在聚焦的时候都有一个黄色的边框,而且textarea还可以任意拖动放大,这是不能容忍的,影响美观不说,有时候拖动textarea还会使页面布局错乱,所 ...
- css改变hr的默认样式
-----------笔记------------- 实现效果:改变默认标签<hr />的样式 改变<hr />的默认样式需要写成行内样式 <hr style=" ...
- html overflow 样式,css修改overflow滚动条默认样式
html代码 这是内容111 这里是内容222 这里是内容333 css代码 .inner{ width: 265px; height: 400px; position: absolute; top: ...
- chrome/FF/safari浏览器下input和textarea的默认样式outline和resize
outline:input和textarea的默认焦点样式 语法:outline:[outline-color] || [outline-style] || [outline-width] || [o ...
- css修改el-button的默认样式
这里以el-button–mini为例: .el-button–mini { color: #fff; background-color: #FC813B; border-color: #FC813B ...
- html默认样式重置,我们真的需要CSS重置来清除默认样式吗?
每个浏览器都有他自己的一个默认样式,用来保证HTML在没有自定义样式的情况下也能被有据可循的渲染,比如:未访问的链接是蓝色.访问过的是紫色.strong标签加粗显示.H1的字号大一些.然而,各厂商就是 ...
- css知多少(4)——解读浏览器默认样式
原文:css知多少(4)--解读浏览器默认样式 上一节<css知多少(3)--样式来源与层叠规则>介绍了样式的五种来源,咱们再通过一张图回顾一下. 对于上面的三层,咱们大概都比较熟悉了.下 ...
- 用css去除chrome、safari等webikt内核浏览器对控件默认样式
有这么一个webkit的私有属性: -webkit-appearance:none; /*去除input默认样式*/ 添加该样式,并且值为'none'时即可取消浏览器对于控件的默认样式. 另外这个属性 ...
- 浏览器的默认样式及去除
目录 前言 一.reset 二.normalize 总结 前言 通常情况,浏览器都会为元素设置一些默认样式,默认样式的存在会影响到页面的布局,通常情况下编写网页时必须要去除浏览器的默认样式(PC端的页 ...
最新文章
- [Swift通天遁地]七、数据与安全-(19)使用Swift实现原生的SHA1加密
- 在控制台中录入一个字符串 , 打印这个字符串中的字符以及出现的次数(Python)
- idea 提示接口注释信息
- Hadoop 序列化
- python文件批量重命名以数字~n的方式重命名_利用Python对文件进行批量重命名
- html中transition默认,CSS3中的Transition详解
- sql中exists与in的区别
- Python tolist()用法
- java程序在哪里运行_JAVA代码是怎么运行的
- 可以这样理解 TIM_INIT(arr,psc)重装载值和分频值
- ArtWork+并查集二维
- 在linux下 用户的密码错误,linux中root用户密码错误如何解决
- 微信、小程序、h5等实名认证接口
- FPGA入门实验-寻迹小车的实现
- vue配置多页面应用~
- Python灰帽子——黑客与逆向工程师的Python之道
- 如何在OC类里 调用swift类
- Process 2(完成版)
- 学习笔记:中国大学排名定向爬虫
- 上海交大计算机专业挂科,上海交大,3名本科生绩点不足1.0被勒令退学,大学不挂科很难?...
热门文章
- 【月径流预测】基于matlab未来搜索算法算法优化BP神经网络月径流预测【含Matlab源码 2001期】
- 【多目标优化求解】基于matlab人工鱼群求解多目标优化问题【含Matlab源码 442期】
- 【图像分割】基于matlab分水岭算法图像分割【含Matlab源码 390期】
- idea新建一个java项目_创建第一个Java项目(Create First Java Project)
- anaconda开发python_使用anaconda和pycharm搭建多python本版的开发环境
- 误用检测_如何(不)在创业中误用人工智能
- 机器学习指南_管理机器学习实验的快速指南
- linux汇编section标签,Linux内核中常用的汇编
- 计算机软件技术基础教程 试卷,《计算机软件技术基础》试卷A-16
- aqara (737) -(a俩)_绿米与万科合作?Aqara线下服务商500家,合作有保障