• 首页>
  • 软件教程>
  • input按钮在IE下显现不一致的兼容是什么问题?解决技巧分享

input按钮在IE下显现不一致的兼容是什么问题?解决技巧分享

2024-06-24 10:34:22阅读量:35 字体:

这段时间在处理网页默认的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稍加做了修改,如下:

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

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

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



推荐阅读

  • qq进群特效怎么关闭

    qq进群特效怎么关闭

    想要关闭qq进群特效,可以在qq群的进群特效相关功能进行关闭,开通超级会员才能享受进群特效,通过以下步骤关闭qq进群特效: qq进群特效怎么关闭 1、打开qq,点击qq群”进入qq群聊天页...

    阅读: 697

  • 地摊怎么申请微信商家码

    地摊怎么申请微信商家码

    地摊想要申请微信商家收款二维码,可以从微信收款小账本进行相关设置即可申请微信商家收款二维码,通过以下步骤可以申请微信商家收款二维码: 地摊怎么申请微信商家码 1、打开微信,切换到发现页面,点击小程序&...

    阅读: 798

  • 微信拉黑和删除

    微信拉黑和删除

    微信加入黑名单后给对方发消息,对方可以看到但不能回复,微信删除后双方都不能发消息,微信拉黑和删除具体步骤如下: 微信拉黑和删除 1、打开微信,切换到通讯录页面,点击联系人”进入联系人名片...

    阅读: 728

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

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

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

    阅读: 689

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

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

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

    阅读: 766

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

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

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

    阅读: 770