我们都知道,web开发中浏览器兼容性是困扰很多开发者的一个问题。所谓兼容性问题,即不同浏览器对同一段代码有不同的解析效果。而我们的需求往往是无论用户使用何种浏览器查看我们的网站,都应该获得相同或相近的体验。

浏览器兼容性问题主要分为HTML兼容问题(标签及其所属api的兼容问题)、css兼容问题、JavaScript兼容问题。今天只简洁说说其中一个点,这也是我们常常会遇到的,即样式兼容问题。

常见的样式兼容问题有:

外边距、内边距表现不一致;

某些元素在不同浏览器中是块状还是行内显示不明确;

垂直对齐方式的表现不一致性;

a链接、input输入框、按钮、img的下划线、外轮廓、边框表现不一致;

移动设备方向变化后文字大小变化的不一致性;

……

基于诸如上述问题,我们通常采用所谓css重置来解决,即重写会出现浏览器兼容性问题的标签的样式,以此来覆盖浏览器默认样式,达到表现一致的目的。常用的工具类有reset.css,不过reset.css比较激进,我们现在更常用的是normalize.css。

css reset浅谈的更多相关文章

  1. 【css】浅谈BFC

    定义: 块格式化上下文(Block Formatting Context,BFC) 是Web页面的可视化CSS渲染的一部分,是块盒子的布局过程发生的区域,也是浮动元素与其他元素交互的区域. BFC的布 ...

  2. #WEB安全基础 : HTML/CSS | 0x11 浅谈GET和POST

    HTTP中的GET和POST请求方法 我上次提到了GET和POST,现在就让你来认识一下这些新朋友 请看图 POST和GET都是将用户输入到浏览器的数据发送给服务器,不过采用了两种不同的方式,POST ...

  3. css选择器浅谈

    css选择器有很多,种类的话总结起来有5种.即: id选择器,class选择器,elements选择器,级联选择器,相邻选择器. 前三个没什么好说的,分别是id,class和标签的选择,注意选中对象的 ...

  4. 【HTML+CSS】浅谈:相对定位与绝对定位

    相对定位和绝对定位 ·定位标签:position  ·包括属性:relative(相对) absolute(绝对) 1.position:relative; 假设对一个元素进行相对定位.首先它将出如今 ...

  5. 浅谈Normalize.css

    浅谈Normalize.css 一.总结 1.Normalize.css:它在默认的HTML元素样式上提供了跨浏览器的高度一致性,花了几百个小时来努力研究不同浏览器的默认样式的差异. 2.优于rese ...

  6. 转:浅谈CSS在前端优化中一些值得注意的关键点

    前端优化工作中要考虑的元素多种多样,而合理地使用CSS脚本可以在很大程度上优化页面的加载性能,以下我们就来浅谈CSS在前端优化中一些值得注意的关键点: 当谈到Web的“高性能”时,很多人想到的是页面加 ...

  7. 浅谈对CSS的认识

    自从进公司也有2个多月了,相信和我一批进来的小伙伴们都收获了很多东西,这个是在学校所学不到的,也让成长了很多.作为新人的我,从认为CSS是个很简单的东西,到现在觉得CSS中水很深,感觉学了很多的CSS ...

  8. [转]浅谈Normalize.css

    原文地址:https://www.jianshu.com/p/3d21d1932aa0 Normalize.css只是一个很小的css文件,但它在默认的HTML元素样式上提供了跨浏览器的高度一致性.相 ...

  9. 浅谈nornalize.css(含源码)

    Normalize.css是一种CSS reset的替代方案.经过@necolas和@jon_neal花了几百个小时来努力研究不同浏览器的默认样式的差异,这个项目终于变成了现在这样. 我们创造norm ...

随机推荐

  1. Camtasia Studio8使用教程

    tip:善于使用ctrl+f搜索目录查看内容 目录 软件的下载与安装 软件的汉化与界面介绍 录制前准备与试机录制 录像机的设置 屏幕画 导入与编辑视频(包括图片,音乐,媒体) 时间线轨道时间轴 标记的 ...

  2. Oracle数据库编程:PL/SQL编程基础

    2.PL/SQL编程基础: PL/SQL块:        declare        定义部分        begin        执行部分        exception        异 ...

  3. SIGGRAPH

    这两天看了一些文章,今天来说说SIGGRAPH. 对于搞图形学的人来说,SIGGRAPH绝对是如雷贯耳.SIGGRAPH是计算机图形界(也包含图像)最顶级的会议,没有之中的一个,是全世界的图形学者公认 ...

  4. C++ CheckListBox

    实现过程 CCheckListBox    listbox1;     listbox1.AddString("葡萄");     listbox1.AddString(" ...

  5. [Javascript] Drawing Paths - Curves and Arcs

    window.onload = function() { var canvas = document.getElementById("canvas"), context = can ...

  6. careercup-排序和查找 11.6

    11.6 给定M*N矩阵,每一行.每一列都按升序排序,请编写代码找出某元素. 类似leetcode:Search a 2D Matrix 但是与leetcode中这题不同的是下一行的第一个元素不一定大 ...

  7. 标准I/O库之标准I/O的效率

    程序清单5-1 用getc和putc将标准输入复制到标准输出 #include "apue.h" int main( void ) { int c; while(( c = get ...

  8. [转]HTML5 classList API

    Having thrust myself into the world of JavaScript and JavaScript Libraries, I've often wondered: Whe ...

  9. Android5.0之CoordinatorLayout的使用

    CoordinatorLayout,中文译作协调者布局,光听这名字你可能很难判断出协调者布局有什么特点,那么我们来看看下面一张图片: 由于CSDN对图片大小的要求,我只能录制一个快速播放的动画,请大家 ...

  10. 关于Fragment与Fragment、Activity通信的四种方式

    一直想总结一下Fragment与Fragment.Activity通信的问题,今天有时间一共总结了三种,权当抛砖引玉,如果大家还有更好的方式来实现Fragment和Fragment.Activity的 ...