input 按钮在IE下显现不一致的兼容问题

2024-06-24 11:06:02阅读量：34 字体：大 中 小

这段时间在处理网页默认的input 按钮时，IE下常显现不一致的宽度问题，让人感到很纠结。所以今天请教了几位高手把这个问题解决了，现在贴出来和大家共享一下，当然这个方法在网上曾有人写过，大家可以一起来相互探讨一下。

Html Code:

input 按钮在IE下显现不一致的兼容问题

我先在这里贴出一段初始的CSS样式

CSS Code:

我看先来看看效果图吧：

从上图中我们明显可以看出，只有在Firefox下显示才是正常，在IE7和IE下没有圆角效果，这个都是众所周知，但IE7具有一个致命的问题，就是宽度变长了，大家一定会感到奇怪，我们没有定宽度的呀，怎么会这样呢?呆会我们会引用别人的说法了说明这个问题;另外就是Safari和Chrome下高度怎么也不行的呀。

就是因为这样的问题，我纠结了一个下午，但在高人的指点下，还是找到了相关的解决办法，现在我们一起来看看高人是如何解决这样的兼容问题。在IE7下会随着文字的增加导致文本距离按钮左右两侧的间距越来越大，这样就导致了上图中所看到的效果，但该问题存在于IE6/IE7，FF、IE8以及Opera 10没发现类似问题。对于另一情况，小生至今还没有弄明白为什么在Safari和Chrome下会出现高度问题，还希望各位前辈和高手指点。

针对前面的Bug，我对我的CSS稍加做了修改，如下：


也就是我在以前的基础上增加了以下几行代码

这样我们就把那个头痛的问题解决了，大家可以一起看看修改后的效果：

这里提醒大家，对于字居中的问题，不仅受行高影响，而且还受其字体，字号的影响，大家感兴趣的可以尝试一下。


免责声明：

本文《input 按钮在IE下显现不一致的兼容问题》版权归原作者所有,内容不代表本站立场！

如本文内容影响到您的合法权益（含文章中内容、图片等），请及时联系本站，我们会及时删除处理。

推荐阅读

  • qq音乐删除访问记录别人能看见吗

    qq音乐删除访问记录别人能看见吗

    qq音乐删除了访问记录别人是不能看到的，可以在访客功能中删除访问记录，通过以下步骤删除qq音乐访问记录： qq音乐删除访问记录别人能看见吗 1、打开qq音乐，切换到个人中心，点击头像”进入...

    阅读: 690

  • 新加好友怎么才能分享屏幕

    新加好友怎么才能分享屏幕

    qq聊天中自带有分享屏幕的功能，只要加了好友，直接点击分享屏幕就可以将屏幕分享给对方。具体操作方法如下： 新加好友怎么才能分享屏幕 1.在qq中找到要分享屏幕的好友，点击进入对话界面。 2.点击对话...

    阅读: 766

  • 手机锁屏微信语音视频没有提示声音

    手机锁屏微信语音视频没有提示声音

    手机锁屏微信语音视频没有提示声音可能是关闭了，接收语音和视频通话邀请提醒，如果关闭了就不会有提醒，可以通过设置重新开启这个功能，具体操作步骤如下： 手机锁屏微信语音视频没有提示声音 1、打开微信app...

    阅读: 771

  • 荣耀60声音小怎么办

    荣耀60声音小怎么办

    如果荣耀60手机的声音比较小的话，可以去系统内进行相应的调整，把手机的声音调大，具体的操作步骤如下： 荣耀60声音小怎么办 1、打开手机的设置，点击声音和振动”按钮，进入声音和振动的设置页...

    阅读: 852

  • ipad pro怎么录屏

    ipad pro怎么录屏

    ipad pro设备有录屏的功能，有需要的用户可以去手机的控制中心内打开按键进行录屏，具体的操作步骤如下： ipad pro怎么录屏 1、进入手机的桌面中，从手机屏幕的右上角往下滑，呼出控制中心的界面...

    阅读: 901

  • 苹果平板如何隐藏app软件

    苹果平板如何隐藏app软件

    苹果平板没有隐藏app软件的功能，但是可以把app下载到资源库中，这样就不会显示在平板的桌面上，操作方法如下： 苹果平板如何隐藏app软件 1、打开平板的设置，点击主屏幕”按钮，进入主屏幕...

    阅读: 749

热门文章

最近更新