程序设计 css

6

我的html表有问题，它的父容器溢出了。 .page { width: 280px; border:solid 1px blue; } .my-table { word-wrap: break-word; } .my-table td { border:solid 1px #333; } <div class="page"> <table class="my-table"> <tr> <th>Header Text</th> <th>Col 1</th> <th>Col 2</th> <th>Col 3</th> <th>Col 4</th> <th>Header Text</th> </tr> <tr> <td>An archipelago is a chain or cluster of islands. The …

136 html css html-table

13

如何从输入按钮删除轮廓边框

当单击其他地方的边框消失时，尝试无焦点，但无济于事，如何使单击时丑陋的按钮边框消失？ input[type="button"] { width: 120px; height: 60px; margin-left: 35px; display: block; background-color: gray; color: white; border: none; } <input type="button" value="Example Button"> 运行代码段隐藏结果展开摘要

136 css button

10

将div内的图像与响应高度垂直对齐

我有以下代码，用于设置一个容器，该容器的高度在调整浏览器大小（以保持正方形长宽比）时随宽度而变化。的HTML <div class="responsive-container"> <div class="dummy"></div> <div class="img-container"> <IMG HERE> </div> </div> 的CSS .responsive-container { position: relative; width: 100%; border: 1px solid black; } .dummy { padding-top: 100%; /* forces 1:1 aspect ratio */ } .img-container { position: absolute; top: 0; bottom: 0; left: 0; right: 0; } 如何在容器内垂直对齐IMG？我所有的图像都有可变的高度，并且容器不能具有固定的高度/线条高度，因为它反应灵敏...请帮助！

135 html css responsive-design vertical-alignment

8

将图像嵌入到<button>元素中

我正在尝试<button>在HTML 的元素上显示png图像。该按钮与图像的大小相同，并且显示了图像，但由于某种原因不在中心，因此无法看到全部。换句话说，图像的右上角似乎位于按钮的中心而不是按钮的右上角。这是HTML代码： <button id="close" class="closing" onClick="javascript:close_clip()"><img src="icons/close.png" /></button> 更新：我认为实际发生的是利润问题。我得到两个像素的边距，因此背景图像从按钮中消失了。该按钮和图像的大小相同，这是唯一的20px，所以这是非常noticable ......我试过margin:0，padding:0但它并没有帮助...

135 html css image button

9

如何为没有href的链接设置指针的光标样式

我有很多<a>html标签，但没有href用于进行onclickjavascript调用的属性。这些链接没有光标的指针样式。他们有文字样式的游标。如何在不使用href属性的情况下将光标样式设置为链接的指针？我知道我可以添加href =“＃”。我在html文档的很多地方都有此功能，并且想知道如何在不使用href属性的情况下为链接创建光标样式指针。

135 javascript html css hyperlink cursor

4

在CSS中强迫孩子服从父母的弯曲边界

我在另一个div内有一个div。 #outer和#inner。 #outer具有弯曲的边框和白色背景。 #inner没有弯曲的边框和绿色背景。 #inner延伸到弧形边界之外#outer。反正有阻止这个的吗？ #outer { display: block; float: right; margin: 0; width: 200px; background-color: white; overflow: hidden; -moz-border-radius: 10px; -khtml-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } #inner { background-color: #209400; height: 10px; border-top: none; } <div id="outer"> <div id="inner"></div>  <!-- …

135 css

8

设置表格行高

我有以下代码： <table class="topics" > <tr> <td style="white-space: nowrap; padding: 0 5px 0 0; color:#3A5572; font-weight: bold;">Test</td> <td style="padding: 0 4px 0 0;">1.0</td> <td>abc</td> </tr> <tr> <td style="white-space: nowrap; padding: 0 5px 0 0; color:#3A5572; font-weight: bold;">test2</td> <td style="padding: 0 4px 0 0;">1.3</td> <td>def</td> </tr> </table> 行之间的距离太远。我希望线条更紧密。我所做的是添加以下CSS，但似乎没有任何改变。 .topics tr { …

135 html css

2

使用CSS选择倒数第二个元素

我已经知道：last-child。但是有没有选择div的方法： <div id="container"> <div>a</div> <div>b</div> <div>SELECT THIS</div>  <div>c</div> </div> 注意：没有jQuery，只有CSS

135 html css css-selectors

5

100％宽度的Twitter Bootstrap 3模板

我是一个Bootstrap新手，我有一个100％宽的模板，我想使用bootstrap进行编码。第一列从左上角开始，我在Google地图上将拉伸范围扩展到最右边。我以为可以在container-fluid课堂上做到这一点，但这似乎不再可用。我不知道如何使用bootstrap 3来实现该布局。我正在使用themeforest中的Geometry PSD模板，如果您想查看布局，请使用此处的链接：http ://themeforest.net/item/geometry-design-for- geolocation-social-networkr / 4752268

134 html css twitter-bootstrap layout twitter-bootstrap-3

4

淡入淡出对链接悬停有影响吗？

在许多站点（例如http://www.clearleft.com）上，您会注意到，当链接悬停在链接上时，它们将淡化为其他颜色，而不是立即切换（默认操作）。我假设使用JavaScript来创建这种效果，有人知道吗？

134 css hover fade effect

17

您可以在Bootstrap中禁用标签页吗？

您可以像禁用按钮一样禁用Bootstrap 2.0中的选项卡吗？

134 javascript css twitter-bootstrap twitter-bootstrap-2

10

如何使IFrame在iOS Safari中做出响应？

问题是，当您不得不使用IFrame将内容插入网站时，那么在现代网络世界中，人们期望IFrame也会响应。从理论上讲，它很简单，只需辅助使用<iframe width="100%"></iframe>或将CSS宽度设置为即可，iframe { width: 100%; }但是在实践中，并不是那么简单，但是可以。如果iframe内容具有充分的响应能力，并且可以在没有内部滚动条的情况下调整自身大小，则iOS Safari可以调整，iframe而没有任何实际问题。如果考虑以下代码： <html> <head> <meta http-equiv="X-UA-Compatible" content="IE=9,10,11" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>Iframe Isolation Test</title> <style type="text/css" rel="stylesheet"> #Main { padding: 10px; } </style> </head> <body> <h1>Iframe Isolation Test 13.17</h1> <div id="Main"> <iframe height="950" width="100%" src="Content.html"></iframe> </div> </body> </html> 使用Content.html： <html> <head> …

134 html css iframe

4

位置绝对和溢出隐藏

我们有两个DIV，一个嵌入另一个。如果外部DIV的位置不是绝对的，则内部DIV的位置绝对不遵循外部DIV的隐藏溢出（示例）。是否有机会使内部DIV服从外部DIV的隐藏溢出，而无需将外部DIV设置为绝对位置（因为这会破坏我们的完整布局）？相对于内部DIV的相对位置也不是一种选择，因为我们需要“增长”到表TD（exmple）。还有其他选择吗？

134 html css layout overflow css-position

12

Amazon S3 CORS（跨域资源共享）和Firefox跨域字体加载

Firefox存在一个长期存在的问题，即不加载与当前网页不同来源的字体。通常，在CDN上提供字体时会出现问题。在其他问题上提出了各种解决方案： CSS @ font-face不适用于Firefox，但适用于Chrome和IE 随着Amazon S3 CORS的推出，是否存在使用CORS解决Firefox中字体加载问题的解决方案？编辑：非常高兴看到S3 CORS配置的样本。 edit2：我找到了一个可行的解决方案，但实际上并没有理解它的作用。如果任何人都可以提供有关配置的更详细的解释以及亚马逊解释配置时发生的背景魔术，那将不胜感激，就像nzifnab为其提供赏金一样。

134 css firefox amazon-s3 font-face cors

14

将Font Awesome图标制作成一个圆圈吗？

我在某些项目上使用了真棒字体，但是我想对真棒字体图标做一些事情，我可以很容易地这样调用一个图标： <i class="fa fa-lock"></i> 是否所有图标都始终处于带边框的圆形圆圈中？像这样，我有一张照片：使用 i { background-color: white; border-radius: 50%; border: 1x solid grey; padding: 10px; } 会产生效果，但是问题是图标总是比旁边的文本或元素大，有解决方案吗？

134 css font-awesome

Questions tagged «css»