`

[开发笔记] 跨浏览器兼容性进一步提高了

阅读更多
以前比较懒, GT-Grid在不同浏览器下只要看起来差不多 我就收手了.

但是如果你仔细比较 会发现 原先的版本在不同浏览器里还是有细微的不同的,主要是体现在列表 和单元格的 宽度 高度等.


这些问题的根源就是 因为各个浏览器在对待 padding margin border width height....这些东西时, 采取的策略不同.

今天花了些时间 改了下代码 ,现在几乎可以做到各个浏览器下 完全一致了.

其实实现这些也不难.

判断浏览器类型 再判断是否是Strict 然后在设置宽度 高度时 进行统一的处理,
根据情况减去或加上padding border margin .....

不过为了效率 padding border margin 这些是我写死了
而不是想很多框架那样 每次都去取border padding等.

因为GT-Grid虽然支持 换肤,但是并不支持和鼓励使用者对 CSS做肆无忌惮的修改

到最后 大家能修改的应该只是 颜色 图片 字体相关的东西, 其他的最好还是不要改.
因为css和js在某些程度上是耦合的.



分享到:
评论

相关推荐

    Oracle Web ADI 开发笔记(抽丝拨茧篇)

    - **Excel设置**:除了浏览器外,还需要对Excel进行适当的设置,以确保与Web ADI的兼容性,例如启用宏支持等。 #### Web ADI - GL 导入 这部分详细介绍了如何使用Web ADI来进行General Ledger(总账)模块的数据...

    64位MicrosoftEdge浏览器.rar

    最后,64位Microsoft Edge浏览器强调跨平台的兼容性,无论是在Windows、macOS还是Android、iOS设备上,都能保持一致的用户体验,让用户在不同设备间无缝切换,实现真正的多设备同步。 总的来说,64位Microsoft Edge...

    高仿WebQQ代码

    【描述】中的“适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗”表明了该高仿WebQQ代码兼容多种浏览器,这需要开发者具备跨浏览器兼容性的知识。在实际开发过程中,需要考虑不同...

    bootstrap模板paper-m开发笔记

    9. **兼容性**:考虑到浏览器的多样性,Paper-M模板应确保在主流浏览器(如Chrome、Firefox、Safari、Edge)上的良好表现,并且兼容最新的Web标准。 10. **性能优化**:优秀的模板会考虑性能优化,如压缩CSS和...

    JavaScript学习笔记

    2. **页面加载事件的跨浏览器兼容性**:在不同浏览器中,页面加载事件的绑定方式存在差异,IE浏览器使用`attachEvent`,而其他现代浏览器使用`addEventListener`。理解这些差异并作出相应的兼容性处理,是确保Web...

    Vivaldi浏览器最新版

    5. **扩展应用兼容性**:Vivaldi浏览器支持多种Chrome扩展,6.5版可能对扩展的兼容性和稳定性进行了改进,让用户可以更好地利用第三方工具来扩展浏览器功能。 6. **笔记与同步功能**:Vivaldi内置的笔记功能允许...

    Obsidian 中使用的浏览器插件

    为了进一步提升用户体验和功能拓展,许多开发者为Obsidian开发了各种浏览器插件。本文将深入探讨这些插件的工作原理、用途及如何安装和使用。 首先,我们来看看一个插件的基本构成。在提供的压缩包文件中,我们可以...

    《前端开发笔记本》 中文字版 非扫描版 带标签 超清晰

    - **浏览器兼容**:讨论不同浏览器对HTML的支持差异,并提供解决方案。 3. **CSS**: - **语法**:解释CSS的基本语法结构,包括选择器、属性和值。 - **选择器**:介绍各种CSS选择器(如类选择器、ID选择器、...

    JavaScript.pdf

    了解这些浏览器的内核对于解决跨浏览器兼容性问题至关重要。 JavaScript的基本数据类型和引用数据类型有明显的区别,基本数据类型直接存储数据值,而引用数据类型存储的是数据的引用(即内存地址)。在JavaScript中...

    JavaScript学习笔记.doc

    6. **浏览器兼容性**:由于不同的浏览器对JavaScript的支持程度和实现方式存在差异,可能导致代码在某些浏览器中运行不正常。解决这个问题的方法是使用跨浏览器的函数库,如jQuery,或者采用条件注释和特性检测来...

    工作过程中的学习笔记

    另外,开发过程中可能会遇到跨平台、兼容性问题。比如前端开发要考虑不同浏览器的差异,后端开发要考虑不同操作系统或服务器环境的适配。此时,需要了解各平台特性,使用兼容性良好的库和框架。 【学习笔记的持续...

    JavaScript高级程序设计阅读笔记(十六) javascript检测浏览器和操作系统-detect.js

    通过JavaScript高级程序设计的阅读笔记(尤其是关于detect.js的部分),我们可以更加深入地了解浏览器的特性,从而在开发中充分利用这些特性来提供更佳的用户体验。需要注意的是,由于各种浏览器的更新迭代速度快,...

    传智播客HTML笔记.rar

    HTML的学习不仅仅限于语法,还包括理解Web标准、优化用户体验、无障碍访问(Web Accessibility)以及跨浏览器兼容性等实践知识。对于初学者,熟悉开发工具如浏览器的开发者工具(DevTools)进行调试和测试是至关重要...

    JavaScript语言概述笔记和常用工具

    其中,ES5具有良好的跨浏览器兼容性,而ES6和ES7则引入了许多新的特性和语法,但它们的兼容性相对较差。 JavaScript是基于对象的、面向过程的语言,它对大小写敏感,并且每条语句通常以分号结尾。JavaScript代码...

    js网页左上角扇形导航菜单特效.zip

    在网页开发中,跨浏览器兼容性是一项重要的考虑因素,因为不同的浏览器可能对CSS、JavaScript的解析和执行方式有所不同。 "有能力的还可以二次修改"则暗示这个导航菜单特效是可定制的。jQuery代码的结构化和模块化...

    jquery学习笔记

    - **跨浏览器兼容性**:jQuery解决了不同浏览器之间的差异,确保代码可以在所有现代浏览器中正常运行。 - **链式代码**:支持链式调用,提高代码的可读性和简洁性。 - **强大的事件处理能力**:内置了许多常用的事件...

    JavaScript复习笔记

    - **ECMA标准**:为了确保跨浏览器兼容性,JavaScript遵循ECMA-262标准,这有助于保持语言的一致性和稳定性。 #### 四、JavaScript的核心组成部分 - **ECMAScript**:这是JavaScript的核心语言部分,定义了基本的...

    12_JavaScript笔记.pdf

    这导致了JavaScript存在一定的浏览器兼容性问题,开发者需要考虑不同浏览器的差异。 JavaScript是一门解释性语言,这意味着它的代码不需要预先编译,而是逐行由解释器执行。这种特性使得JavaScript具有跨平台的优势...

    CLEditor v1.3.0

    这款编辑器以其轻量级、跨浏览器兼容性和高度可扩展性而受到青睐。以下是对这个插件的详细介绍和相关知识点的展开。 1. **jQuery 插件**:CLEditor 是基于 jQuery 框架构建的,这意味着它能够充分利用 jQuery 提供...

Global site tag (gtag.js) - Google Analytics