Questions tagged «css»

开发iPad网站时，我尝试使用CSS属性overflow: auto获取滚动条（如果需要）div，但是即使两个手指滚动正常，我的设备也拒绝显示滚动条。 我尝试过 overflow: auto; 和 overflow: scroll; 结果是一样的。 我仅在iPad上进行测试（在桌面浏览器上可以正常运行）。 有任何想法吗？

82 css  ipad  ios 

在设计布局时，我将html, body元素设置为height，100%但是在某些情况下，这失败了，那么应该使用什么？ html, body { height: 100%; } 要么 html, body { min-height: 100%; } 嗯，这不是基于观点的，因为每种方法都有其自身的缺陷，那么推荐的方法是什么？为什么？

82 html  css 

有谁知道是否有可能将文本对齐到WebKit中一个<select>或更具体的<option>元素的右边。这不必是包括IE的跨浏览器解决方案，但如果可能的话，应该是纯CSS。 我都尝试过： select { text-align: right }和option { text-align: right }，但似乎都无法在WebKit中使用（Chrome，Safari或Mobile Safari。 任何帮助表示感谢！

82 html  css  webkit 

我的理解是所有Bootstrap样式的元素都必须存在于一个<div class="container">元素内。但是有时我会看到存在多个“容器”的Bootstrap示例： <div class="container"> <!-- Blah, GUI stuff, blah --> </div> ... <div class="container"> <!-- Blah, more GUI stuff, blah --> </div> 我的问题： 什么时候需要一个带有多个“容器div”的HTML页面？与将整个身体放在一个大的“容器div”中相比，这有什么好处？ 您是否想在其他容器中嵌套“容器div”？什么时候/为什么？

82 css  twitter-bootstrap 

内的所有元素.track-container应并排且整齐并排，并受到200px高度的限制，并且没有奇怪的边距或填充。相反，您会遇到上述小提琴中出现的陌生感。 是什么原因造成.album-artwork，并.track-info得到中途按下页面，我怎么能解决这个问题？另外，我承认表可能是解决整个设置的更好方法，但是我想从上面的代码中找出问题，以便我可以从这个错误中学习。 .track-container { padding:0; width: 600px; height: 200px; border: 1px solid black; list-style-type: none; margin-bottom: 10px; } .position-data { overflow: none; display: inline-block; width: 12.5%; height: 200px; margin: 0; padding: 0; border: 1px solid black; } .current-position, .position-movement { height: 100px; width: 100%; margin: 0; padding: 0; border: 1px …

82 html  css 

是否可以为div上的垂直滚动条指定位置（左侧或右侧）？ 例如，查看此页面，其中说明了如何使用溢出属性。有什么方法可以将滚动条放在可滚动区域的左侧？

82 html  css 

我正在使用Bootstrap，并绘制表格。最右边的列中有一个按钮，我希望它降低到适合该按钮所需的最小尺寸。 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <table class="table table-responsive"> <tbody> <tr> <th>Name</th> <th>Payment Method</th> <th></th> </tr> <tr> <td>Bart Foo</td> <td>Visa</td> <td><a role="button" class="btn btn-default btn-xs" href="/Payments/View/NnrN_8tMB0CkVXt06nkrYg">View</a></td> </tr> </tbody> </table> 运行代码段隐藏结果展开摘要 呈现如下： 在突出显示萤火虫的同时，列的宽度也是如此宽： 当页面处于较大的动态宽度模式时，该列随页面缩放。我知道如何在纯CSS中修复此问题，但是大多数方法可能会导致网站的低宽度版本出现问题。 如何使该列下降到其内容的宽度？ （与以往一样-现有的引导程序类>纯CSS> Javascript）

82 html  css  twitter-bootstrap 

我有一个列表，我想在列表文本之前添加刻度符号。是否有任何CSS可以帮助我以这种方式应用？ ✓ this is my text ✓ this is my text ✓ this is my text ✓ this is my text ✓ this is my text ✓ this is my text 注意：我需要这种类型的HTML代码 <ul> <li>this is my text</li> <li>this is my text</li> <li>this is my text</li> <li>this is my text</li> <li>this …

82 css  html  special-characters 

我想创建一个进度条，如下图所示： 我不知道要创建这个。我应该使用HTML5技术吗？ 您能否给我一些有关创建此进度条的帮助？

82 html  css  progress-bar 

我正在使用CSS转换在CSS转换状态之间进行转换（基本上是在转换元素的比例）。我注意到当元素过渡时，页面上的其余文本（在Webkit中）倾向于稍微改变其呈现方式，直到过渡完成为止。 小提琴：http : //jsfiddle.net/russelluresti/UeNFK/ 我还注意到在我的标头上没有发生这种情况，标头上具有-webkit-font-smoothing: antialiased属性/值对。因此，我想知道，是否有任何方法可以使文本保持其默认外观（字体平滑的“自动”值）并且在过渡期间不更改渲染。 我尝试过显式设置文本以使用“自动”值，但这没有任何作用。我还应注意，将字体平滑设置为“无”也可以防止过渡期间渲染闪烁。 任何帮助表示赞赏。 编辑1 我应该注意，我使用的是OSX。在Parallels上的Chrome浏览器中测试时，我没有看到两个不同的段落的行为有所不同，因此这可能是Mac独有的问题。

81 css  webkit  css-transitions  css-transforms 

我正在进行一些高级IE8测试，似乎旧的使用技巧margin: 0 auto;在IE8中并非在所有情况下都有效。 下面的HTML的一块给出了在FF3，歌剧，Safari，铬，IE7居中按钮，IE8 COMPAT，但不是在IE8标准： <div style="height: 500px; width: 500px; background-color: Yellow;"> <input type="submit" style="display: block; margin: 0 auto;" /> </div> （作为一种解决方法，我可以为按钮添加一个明确的宽度）。 所以问题是：哪种浏览器正确？还是这是行为未定义的情况之一？ （我的想法是所有浏览器都不正确-如果按钮的“显示：阻止”按钮不应该是100％宽度吗？） 更新：我是笨蛋。由于输入不是块级元素，因此我应该将其包含在具有“ text-align：center”的div中。话虽如此，出于好奇的缘故，我仍然想知道按钮是否应该在上面的示例中居中。 赏心悦目的：我知道我在示例中做的很奇怪，正如我在更新中指出的那样，我应该将其居中对齐。为了悬赏，我希望引用能回答以下问题的规范： 如果设置为“ display：block”，按钮的宽度应为100％吗？还是这是不确定的？ 由于显示为块，因此应“ margin：0 auto;” 将按钮居中，还是不居中？

81 html  css  internet-explorer-8 

我正在尝试纠正CSS 2.1周围常见的IE错误，并且需要一种更改元素样式属性以添加自定义文本对齐样式的方法。 目前在jQuery中，您可以执行以下操作 $(this).width() or $(this).height() 但我似乎找不到一种用这种方法来改变文本对齐的好方法。 该项目已经有一个类，我在该类中设置了text-align，没有运气。定义类后，是否可以仅向该元素添加文本对齐的CSS属性？ 我有这样的东西 $(this).css("text-align", "center"); 在调整宽度后，在Firebug中查看此内容后，我仅看到“ width”是样式上设置的唯一属性。有什么帮助吗？ 编辑： 哇-对这个问题的回应很大！有关当前问题的更多详细信息： 我正在调整jqGrid A3.5的js源代码来做一些自定义的子网格工作，而我正在调整的实际JS如下所示（对不起，在上面的示例中使用“ this”，但是我想对此保持简单）简洁） var subGridJson = function(sjxml, sbid) { var tbl, trdiv, tddiv, result = "", i, cur, sgmap, dummy = document.createElement("table"); tbl = document.createElement("tbody"); $(dummy).attr({ cellSpacing: "0", cellPadding: "0", border: "0" }); trdiv = …

81 jquery  css  text-align 

请参见以下代码示例：http : //jsfiddle.net/Z2BMK/ Chrome / IE8看起来像这样 Firefox看起来像这样 我的CSS是 button { padding:0; background:#080; color:white; border:solid 2px; border-color: #0c0 #030 #030 #0c0; margin:0; } 如何更改代码示例以使两个浏览器中的按钮相同？我不想使用基于JavaScript的超链接，因为它们不能与键盘上的空格键一起使用，并且必须具有hrefURL，这不是处理问题的干净方法。 我的解决方案，从Firefox 13开始 button::-moz-focus-inner { margin: -1px; padding: 0; border-width: 1px; }

81 css  firefox  button  spacing 

我用CSS创建了一个页面。现在，我必须从编辑器更改为浏览器，并刷新整个页面，以查看每一个小的更改。但是我不想刷新页面，因为我有一些动画。 那么，有什么我可以用来在CSS更新之后自动更新我的网站的信息吗？ 也许使用JavaScript，jQuery，Ajax等？

81 javascript  jquery  html  css  ajax 

好的，这似乎不可能正确。我有一个文本框和一个选择框。我希望它们的宽度完全相同，以便它们在左边距和右边距上对齐。 <!DOCTYPE html> <html> <head> <style type="text/css"> input, select { width: 200px; } </style> </head> <body> <input type="text" value="ABC"><br> <select> <option>123</option> </select> </body> </html> 您会那样做，对吗？不。在Firefox中，选择框短6像素。查看截图。 好的，让我们编辑代码并制作两种样式。 <style type="text/css"> input { width: 200px; } select { width: 206px; } </style> 好的，行得通！ 哦，等等，在Chrome中进行更好的测试... 有人可以告诉我如何在所有浏览器中排列它们吗？我为什么不能只做宽度：全部为200px，为什么所有浏览器都以不同的方式显示宽度？同样，当我们使用它时，为什么文本框和选择框的高度不同？我们如何使它们达到相同的高度？尝试过的高度和线高没有用。 解： 好的，我从下面的答案中获得了一些帮助，找到了解决方案。关键是使用box-sizing：border-box属性，因此当您指定包含边框和填充。在这里查看出色的解释。然后，浏览器无法填充它。 代码在下面，还将框的高度设置为相同的大小，并在框内缩进了文本，使其对齐。您还需要设置边框，因为Chrome的边框看起来很古怪，它用于选择框，因此会导致对齐问题。这将适用于HTML5网站（例如，支持IE9，Firefox，Chrome，Safari，Opera等）。 <!DOCTYPE html> <html> <head> <style …

81 css  html  textbox  drop-down-menu