Tag: CSS

如何摆脱Chrome / Safari上的文本框select突出显示?

使用Chrome或Safari时, active text box或text area将在框中显示蓝色/橙色border 。 我看到一些网站摆脱这一点,但我已经复制了他们的CSS ,它仍然在那里。 我该怎么做?

浮动:右翻转跨度的顺序

我有HTML: <div> <span class="label"><a href="/index/1">Bookmix Offline</a></span> <span class="button"><a href="/settings/">Settings</a></span> <span class="button"><a href="/export_all/">Export</a></span> <span class="button"><a href="/import/">Import</a></span> </div> 和CSS: span.button { float:right; } span.label { margin-left: 30px; } 在浏览器中,按照相反的顺序显示:导入导出设置。 我是否可以通过只更改CSS文件来更改订单,并保持原样?

CSS在每个孩子之后清除

我有一个容器内有多个宽度相同的项目。 由于元素的高度不同,alignment方式有问题,您可以在下面的图像中看到。 我想在每一个第三个项目之后清除而不改变html标记,以便第四个项目进入下一行。 我试图添加n-child(3):之后,但似乎不起作用。 代码如下: HTML: <div class="list"> <div class="item">Lorem ipsum dolor sit amet,</div> <div class="item">Lorem ipsum dolor sit amet, consectetur adipiscing elit. </div> <div class="item">Lorem ipsum dolor sit amet,</div> <div class="item">Lorem ipsum dolor sit amet,</div> <div class="item">Lorem ipsum dolor sit amet</div> </div> CSS: .item:nth-child(3):after{ content: "."; display: block; height: 0; clear: both; visibility: hidden; […]

HTML <label>命令在Iphone浏览器中不起作用

在我正在做的一个HTML页面,我试图让div的可点击使用HTML和CSS。 这已经在我已经testing过的一些主stream浏览器(Chrome,Firefox,Opera,Safari)以及HTC手机上完美运行,但是当我试图在Iphone上testing它时,我发现它不起作用。 checkbox本身甚至不可选。 这是我的(除了iPhone上的代码)代码: HTML: <div class="" style="height: 30px;"> <div style="display: table; width: 100%;"> <div style="display: table-row; width: 100%;"> <div style="display: table-cell;"> <label for="3171">Text….</label> </div> <div style="display: table-cell; text-align: right;"> <input type="checkbox" id="3171" name="3171"> </div> </div> </div> <label for="3171"> <span class="blocklink">Invisible text</span> </label> </div> CSS: .blocklink { display: block; height: 100%; left: 0; overflow: hidden; […]

如何跳过第一个孩子?

<div id="main"> <p> one </p> <p> two </p> <p> three </p> <p> four </p> <p> five </p> <div> 我不想在第<p>One</p>上应用css p {color:red} 我需要对面的:first-child 。

jQuery UI对话框单独的CSS样式

我正在寻找一种模式对话框(使用用户界面对话框)与传统的对话框独立的CSS,所以实质上有两个jQuery对话框,每个看起来不同。 举个例子, <div id="dialog_style1" class="dialog1 hidden">One content</div> 和另一个 <div id="dialog_style2" class="dialog2 hidden">Another content</div> 不幸的是我注意到,使用单独的CSS来设置对话框的部分样式 .dialog1 .ui-dialog-titlebar { display:none; } .dialog2 .ui-dialog-titlebar { color:#aaa; } 不起作用,因为.ui-dialog-titlebar没有类.dialog1 ,我不能做一个addClass ,而不插入插件。 另一种方法是让像body这样的元素具有唯一的class / id(取决于我想要哪一个),但是这样做会阻止在同一个页面中同时存在两个对话框。 我怎样才能做到这一点?

将文本alignment到div的底部

我试图alignment我的文本从其他职位的div的底部和答案在stackoverflow我学会了处理这与不同的CSS属性。 但是我无法完成。 基本上我的html代码是这样的: <div style='height:200px; float:left; border:1px solid #ff0000; position:relative;'> <span style='position:absolute; bottom:0px;'>A Text</span> </div> 效果是,在FF中我只是得到垂直线(div在一个崩溃的方式)和文字被写在旁边。 我怎样才能防止div崩溃,但宽度适合文本?

删除Microsoft Edge的电话号码样式

我注意到,当新的Microsoft Edge浏览器检测到电话号码时,它将覆盖我的样式: <span class="phone">(123)123-1234</span> 看到这个jsfiddle (必须使用Microsoft Edge:P打开)。 这种侵入网站的devise,是相当讨厌的。 当然,这似乎是IE的继任者的特征:/ 我怎样才能覆盖或禁用这个,所以我的网站用户不会看到它?

如何在CSS中控制列表式的光盘大小?

我的HTML第一: <ul class="moreLinks" > <div>More from Travelandleisure.com</div> <li><a rel="nofollow" href="">xyz1</a></li> <li><a rel="nofollow" href="">xyz1</a></li> <li><a rel="nofollow" href="">xyz1</a></li> </ul> 我知道我可以在li上应用font-size,这样光盘看上去对我很正确,然后把css应用到里面的“a”。 但我不知道为什么这不是在我工作的网站上工作。 我无法直接控制html。 我看到,当我这样做: .farParentDiv ul li { list-style: disc inside none; } 对此: .farParentDiv ul li { list-style-type: disc; font-size:10px; } 现在在将字体大小应用到“a”之后,它在Firebug中起作用。 但从我的CSS文件。 我尝试了很多,但很累。 我可以覆盖上面的这个在CSS文件,但不能像我在萤火虫那样直接改变它。 请写下可能是什么问题? 我曾经在连接内部之前把点(。),然后申请CSS来控制光盘的大小,但正如我所说,我无法控制的HTML。

定位背景图片,添加填充

我想添加背景到一个div,位置正确的中心,但是,有一些填充图像。 div为文本填充,所以我想稍微缩进背景。 可能最有意义w /例如: 谢谢!