HTML5日期输入宽度

所以我有一个问题，试图强制日期输入大小。有没有其他人有这个问题或知道如何解决它？HTML5日期输入宽度

<input style="width:50px;" type="date" value="">

这是很简单的，宽度仅改变textarea的，实际的控制不改变，它被固定在约125像素宽度左右。

我也尝试过宽度=“”和最大宽度在CSS中，既不工作。

来源

2013-02-13 Austin Best

你希望mm/dd/yyyy也可以扩展，或者控制似乎对我来说是扩展的。虽然我可能会理解错误。 http://jsfiddle.net/supplement/xu9Xm/ – Supplement 2013-02-13 17:16:10

注意我的例子使用50px，而不是250？我想要比默认的更小，而不是更大。谢谢。 – 2013-02-13 17:29:25

我明白你现在在说什么......这是一个很好的问题。我会看看如果我能为我的朋友挖掘任何东西。 – Supplement 2013-02-13 17:36:05

由于大多数浏览器还没有达到html5的速度。我只会使用jQuery的日期选择器。

<!doctype html> 

<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>jQuery UI Datepicker - Default functionality</title> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" /> 
    <script src="http://code.jquery.com/jquery-1.8.3.js"></script> 
    <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script> 
    <link rel="stylesheet" href="/resources/demos/style.css" /> 
    <script> 
    $(function() { 
    $("#datepicker").datepicker(); 
    }); 
    </script> 
</head> 
<body> 

<p>Date: <input type="text" id="datepicker" /></p> 


</body> 
</html>

我已经使用它很多，它的工作原理。在点击时显示日历以及imo更有意义。

这里的链接，以及：http://jqueryui.com/datepicker/

来源

2013-02-13 17:48:36 Supplement

这是一个Chrome浏览器唯一的应用程序，所以我不担心IE永远不符合标准。如果没有其他解决方案来解决实际问题，我将重新讨论这个解决方案。 +1替代尽管。 – 2013-02-13 17:50:48

谢谢奥斯汀，很高兴我能帮忙并参与讨论。 =] – Supplement 2013-02-13 17:51:55

这不是问题的答案。 – Miles 2014-04-01 21:11:40

的<input type=date>元件被认为在浏览器依赖性的方式适合于在运行浏览器的环境中实现。所以它应该在浏览器的控制之下，而不是作者的。这是许多人对这个想法持怀疑态度的原因之一。

设置控件的宽度实际上是在黑暗中拍摄的。在我的Chrome（Win 7上的25beta）上，您的CSS代码“起作用”，将小部件截断为给定宽度。它仍然有效，但看起来很奇怪：在小部件中，字母“v”和其他字母的一部分是可见的。它们实际上是“vvvv-kk-pp”（“yyyy-mm-dd”的本地化表示法）的记号，我可以在没有任何宽度设置的情况下在小部件中看到它。

结论是：通过使用<input type=date>，您接受浏览器相关的小部件浏览器可能使用的任何内容，并试图控制在其大小可能很糟糕的东西了，

来源

2013-02-13 18:07:38

所有元素都应该遵守为它们指定的CSS，如果它们不是？而且它不像我在编辑时关心UI元素的外观，而是在不编辑时静态显示的值。 – Michael 2016-03-31 05:05:31

随着铬45，我只是设置字体大小。它按比例改变文本和控制手柄。不确定那是你寻找的效果（？）。

<input style="font-size: 3rem" type="date" id="Date">

来源

2015-10-01 17:31:46 GeorgeG

@AustinBest然后选择一个答案作为“解决方案”将是适当的行动。 – kaiser 2015-12-14 10:18:11

远离拖钓。用_wontfix_回答你自己的问题也是一个有效的答案。 – kaiser 2015-12-14 15:23:30

由于这是我的谷歌搜索的顶部，现在是2017年，我能够将Chrome压缩到10英寸宽，但是尽可能小，因为我可以得到它（并且这并不比默认）。我比其他人更喜欢这个答案。 – 2017-02-03 19:56:39

<input type="date" name="tanggal" style="width:231px">

希望这个作品！除了宽度外，它不会改变任何东西。

来源

2017-07-08 13:19:49

HTML5日期输入宽度

回答

相关问题