为什么Firefox中的Bootstrap 3日期输入与Chrome相比看起来有所不同？
巴罗斯
会有人碰巧知道为什么Mozilla Firefox（自69.0.1版起）的Bootstrap 3日期选择器输入的外观与Google Chrome（77.0.3865.120版）之间的区别吗？
是否可以修复外观，如果可以，我该如何解决？问题在于，该值试图停留在Firefox中任何给定日期输入的底部。
在谷歌浏览器中：
在Mozilla Firefox中：
<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label for="sampleInput">Sample input</label>
<input type="date" class="form-control" id="sampleInput" placeholder="">
</div>
</div>
</div>
</div> 李斯特先生
正如泰勒在评论中提到的，这是由媒体查询引起的
@media screen and (-webkit-min-device-pixel-ratio: 0)
在bootstrap.min.css中。它具有-webkit-前缀，因此被设计为仅在基于Webkit的浏览器中使用，但是问题是Firefox的设置也使其也可以处理-webkit-前缀，从而导致此问题。
要关闭此功能，请在Firefox中转到about：config，然后将layout.css.prefixes.webkit或layout.css.prefixes.device-pixel-ratio-webkit设置为false。（这两个中的哪一个可以工作，似乎取决于Firefox的版本。）
或者，如果您不希望用户在Firefox中更改高级设置，则可以通过将这些输入的行高设置回normal您自己的CSS中来撤消Bootstrap CSS。
input[type=date].form-control,input[type=datetime-local].form-control,input[type=month].form-control,input[type=time].form-control {
line-height:normal;
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
自定义NavigationBar按钮在iOS 7中看起来有所不同
- 2
为什么在Chrome / IE和Firefox中重新定义功能的行为会有所不同？
- 3
我正在编写的两个不同应用程序中，Android-studio上的Datepicker看起来有所不同？
- 4
为什么我的JavaScript Google Map与公开的Google Map看起来有所不同？
- 5
包含在页面中时，SVG图标看起来有所不同
- 6
为什么我的CSS与您的CSS看起来有所不同？
- 7
HTML Css按钮在Firefox中看起来有所不同
- 8
为什么在Firefox，Chrome和IE中这种方法工作有所不同？
- 9
WPF：为什么我的前景色在不同的操作系统下看起来有所不同
- 10
为什么与其他所有浏览器一样，我在Chrome中的利润率看起来有所不同
- 11
XAMARIN表单-为什么同一表单在iOS和Android上看起来有所不同
- 12
为什么我的React Web App在某些移动设备上看起来有所不同？
- 13
为什么在Chrome（仅在Windows中）和Firefox中我的样式规则看起来不同？
- 14
以下代码中的字符指针声明数组看起来有所不同
- 15
为什么Vim颜色在tmux的内部和外部看起来有所不同？
- 16
Delphi XE / Windows7：为什么MCL应用程序中的VCL控件看起来有所不同？
- 17
为什么Windows DPI缩放使屏幕元素看起来有所不同？
- 18
Emacs框架背景颜色和默认面部背景设置为相等，但在＃010101中看起来有所不同
- 19
为什么.NET中的n层与其他语言相比有所不同
- 20
包含在页面中时，SVG图标看起来有所不同
- 21
在ssh连接控制台上，不同的用户看起来有所不同。为什么？
- 22
我在Lotus Notes 9.0.1FP4中的联系首选项看起来与公司中的其他联系人有所不同
- 23
为什么在从Netbeans运行的Java应用程序和从Jar运行的Java应用程序中，相同的字体看起来有所不同？
- 24
带有optgroup的样式选择标签在Firefox 40中看起来有所不同
- 25
Bootstrap模态在Chrome和Firefox中看起来有所不同
- 26
为什么与其他所有浏览器一样，我在Chrome中的利润率看起来有所不同
- 27
XAMARIN表单-为什么同一表单在iOS和Android上看起来有所不同
- 28
为什么离子复选框在Android上看起来有所不同？
- 29
为什么在通过x-terminal-emulator运行时urxvt看起来有所不同？
我来说两句