`
yuanyu5237
  • 浏览: 162752 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

css浏览器兼容性等笔记[长期更新]

 
阅读更多

1,很多时候如果不在html页面顶部添加dtd,就会出现很多奇怪的问题,典型的是IE中的文字和内容无法居中,具体dtd详解请参见:http://www.w3school.com.cn/tags/tag_doctype.asp

2,IE中margin浮动产生双倍距离:此时使用display:inline

3,IE中字体可无限小,但chrome最小为12px,所以为了兼容,最好字体大于等于12px

4,IE中没有min-width,有时候为了使容器的大小固定,可以同时设置3个属性,width,min-width,max-width相等

5,文字换行,一般可word-wrap:break-word;word-break:break-all;white-space:normal;overflow:hidden;

6,input的高宽被改变后,其中的内容在IE下会紧靠左上角,此时可以设置line-height, text-align属性来进行调整,实在不行,还可以使用padding来调整

7,如果使用了float属性,一般在一行结束另起一行时,需要使用clear:both;

8,css在IE6,7下正常,在IE8下不正常,可使用<meta http-equiv="x-ua-compatible" content="ie=7" />来保持兼容性

9,去除li的自带样式,使用list-style:none

10,一般在css文件头定义body{padding: 0;margin:0;}结合text-align来处理文本居中问题

11,固定列数但不固定行数的表格,用div进行自适应时,有可能在一个浏览器下每行显示4个,到另外一个浏览器就显示3或5个,这时可使用width:178px;width:170px!important;min-width:170px;max-width:178px;这样的手法来兼容,不要加display:inline

。。。

分享到:
评论

相关推荐

    jQuery学习笔记之jQuery+CSS3的浏览器兼容性

    综上所述,浏览器兼容性问题是一个复杂而长期存在的问题。从IE7的CSS2支持到现代浏览器的CSS3完全兼容,前端开发人员需要了解并处理这些问题,以确保网页在不同浏览器中都能良好展示。通过使用jQuery等JavaScript库...

    Html\CSS+DIV学习笔记(史上最实用的CSS笔记)

    7. **浏览器兼容性**:前端开发需要考虑多种浏览器的兼容性,包括Internet Explorer 6/7/8/9、Firefox和Chrome等。 8. **CSS**:层叠样式表,用于为HTML、XHTML和XML文档添加样式。通过改变CSS,可以快速调整整个...

    div+css学习笔记(IE与fox好多不兼容的问题)

    在网页设计领域,浏览器兼容性问题一直是开发者面临的一大挑战,尤其是在使用HTML、CSS以及JavaScript时。本文主要讨论了IE(Internet Explorer)与Firefox之间在处理`div+css`布局时的一些常见不兼容问题。 1. **...

    CSS笔记全面手册

    2. **字体**:通过`@font-face`规则可以引入自定义字体,`font-family`属性指定字体栈以保证跨浏览器兼容性。 ### 五、CSS边框和边距 1. **边框**:边框的宽度、样式(如solid、dashed)和颜色可自由调整,`border...

    css3 + HTML5笔记

    在某些浏览器中可能需要前缀以保证兼容性。 这些只是CSS3和HTML5中的一部分特性,实际上它们还包括响应式设计、媒体查询、图形绘制(SVG和Canvas)等众多功能,这些都极大地推动了现代网页设计的发展。理解和掌握...

    火狐浏览器不支持有道云笔记网页版

    火狐浏览器不支持有道云笔记网页版的问题可能是由于浏览器兼容性、JavaScript 文件加载、样式表加载或浏览器插件问题引起的。用户可以尝试使用其他浏览器、禁用浏览器插件或使用客户端软件来解决问题。

    自己总结css笔记

    转换过程中,需注意字符集的兼容性和正确性,以避免乱码问题。 ### HTML文档结构与元数据 #### 文档类型声明(DOCTYPE) 用于告知浏览器使用哪种规范解析页面。例如: - `&lt;!DOCTYPE html&gt;`:HTML5文档类型,最...

    韩顺平html+css+js之javascript笔记

    由于JavaScript是在客户端(即用户的浏览器)中执行的,不同的浏览器可能会支持不同的JavaScript特性或版本,这可能会导致兼容性问题。例如,在编写JavaScript代码时,开发者需要注意不同浏览器之间的差异,确保代码...

    CSS+DIV学习笔记(史上最实用的CSS笔记).docx

    - 重置所有元素的CSS属性以解决浏览器兼容性问题。 - 特殊字体处理,可以转换为图片或按优先级设置字体族。 - 使用CSS编辑工具提升效率。 7. **CSS应用方式** - 内联样式表:直接在HTML标签中添加`style`属性。...

    html+css和html5+css3的学习笔记。

    8. **浏览器兼容性**:了解各主流浏览器对新特性的支持情况,合理使用polyfills或前缀。 通过深入学习和实践,你可以创建出既美观又功能丰富的网页,适应不断发展的互联网环境。记住,不断更新知识,保持对新技术的...

    CSS+DIV学习笔记(史上最实用的CSS笔记).pdf

    3. 兼容性:作为前端开发者,必须考虑多种浏览器的兼容性,包括Internet Explorer 6/7/8/9、Firefox、Chrome等。CSS的编写需要考虑到这些浏览器之间的差异,以确保一致的视觉效果。 【CSS基础】 1. CSS语法:基本...

    CSS3实现3D苹果笔记本翻转动画效果源码.zip

    9. **浏览器兼容性**:虽然大部分现代浏览器支持CSS3 3D变换和动画,但要注意老版本的Internet Explorer可能不支持。因此,可能需要借助前缀(如`-webkit-`、`-moz-`、`-ms-`)或者JavaScript库(如jQuery的`....

    CSS_Demo,文章《CSS笔记》配套代码

    **CSS Grid和Flexbox的兼容性**:尽管这些现代布局技术在现代浏览器中得到广泛支持,但需要考虑老旧浏览器的兼容性问题,可以使用Autoprefixer工具来自动添加前缀。 总的来说,"CSS_Demo"文件可能包含了以上部分或...

    css笔记+图解+html

    8. **浏览器兼容性**: - 考虑到不同浏览器对CSS的支持程度,可能需要使用前缀(如`-webkit-`,`-moz-`等)或使用Autoprefixer工具自动添加。 本笔记结合图解,将帮助读者更好地理解CSS的各个方面,通过实例和实践...

    css笔记

    **浏览器兼容性** 1. **Vendor Prefixes**:如`-webkit-`、`-moz-`、`-ms-`,确保在不同浏览器中正确显示CSS3特性。 2. **Can I use**:在线工具,查询CSS特性在各浏览器的兼容情况。 通过深入学习和实践这本“css...

    html_css学习经验笔记.zip

    此外,还包含了响应式设计、浏览器兼容性处理等高级主题,确保学习者能够应对实际开发中的各种挑战。此学习资源特别适合初学者入门,同时也为有经验的开发者提供了宝贵的参考与复习材料。通过系统的学习和实践,用户...

    CSS3自适应浏览器页面框架特效.zip

    "CSS3自适应浏览器页面框架特效.zip"这个压缩包文件,很显然,是针对CSS3技术在自适应网页设计中的应用,特别是与浏览器兼容性相关的特效。结合标签"jQuery特效 CSS特效 网页特效",我们可以推测这个文件可能包含了...

    HTML CSS笔记.zip

    7. **浏览器兼容性**:了解各主流浏览器对CSS特性的支持情况,学会使用Can I Use网站查询,并适当使用前缀 `-webkit-`、`-moz-`、`-ms-`、`-o-` 来保证跨浏览器兼容。 8. **BEM命名规范**:Block Element Modifier...

Global site tag (gtag.js) - Google Analytics