Tag: CSS

触发附加元素的CSS转换

正如这个问题所观察到的那样,在新添加的元素上直接的CSS转换被忽略了 – 转换的最终状态立即被渲染。 例如,给定这个CSS(前缀在这里省略): .box { opacity: 0; transition: all 2s; background-color: red; height: 100px; width: 100px; } .box.in { opacity: 1; } 这个元素的不透明度将被立即设置为1: // Does not animate var $a = $('<div>') .addClass('box a') .appendTo('#wrapper'); $a.addClass('in'); 我已经看到几种触发转换的方法来获得预期的行为: // Does animate var $b = $('<div>') .addClass('box b') .appendTo('#wrapper'); setTimeout(function() { $('.b').addClass('in'); },0); // Does animate var […]

用jQuery获取元素的边距大小

我怎样才能得到一个元素与jQuery的属性? 我想特别获得div边距的大小。 我已经在.css文件中设置了div的样式,例如, .item-form { margin:0px 0px 10px 0px; background: blue; } 的HTML, <form> … <div class="item-form"> <textarea class="autohide"></textarea> </div> … </form> 我试着用这个代码,但是显然失败了, $(".autohide").each(function(){ var $this = $(this); alert($this.parents("div:.item-form").css("margin")); }); 有任何想法吗? 谢谢。

在jQuery中创build一个CSS类

我相信jQuery中的.addClass()函数将CSS类附加到当前的select,但我想知道我可以在jQuery中创build或定义一个CSS类,然后附加它?

把div放在另一个下面

我有两个嵌套在一个包装div内的div。 我想要两个内部的div来安排一个在另一个之下。 但是到目前为止,他们正在安排在同一条线上。 <div id="wrapper"> <div id="inner1"></div> <div id="inner2"></div> </div> CSS是 #wrapper{ margin-left:auto; margin-right:auto; height:auto; width:auto; } #inner1{ float:left; } #inner2{ float:left; }

中心三angular在底部

我试图在我的英雄底部有一个三angular形/箭头,但它不响应,并且不能很好地在移动上工作,因为三angular形漂浮在右边,不再是绝对中心。 我怎样才能让三angular形始终位于div底部的绝对中心? 示例代码在这里: http://jsfiddle.net/SxKr5/1/ HTML: <div class="hero"></div> CSS: .hero { position:relative; background-color:#e15915; height:320px !important; width:100% !important; } .hero:after, .hero:after { z-index: -1; position: absolute; top: 98.1%; left: 70%; margin-left: -25%; content: ''; width: 0; height: 0; border-top: solid 50px #e15915; border-left: solid 50px transparent; border-right: solid 50px transparent; }

获取具有特定CSS类的HTML文档中的所有元素

什么是最好的方式来获得一个具有特定的CSS类使用JavaScript的HTML文档中的所有元素的数组? 现在没有像jQuery这样的javascript框架,我可以循环所有的元素,并自己手动检查它们。 我希望有一些更优雅的东西。

在段落的第一行之后的文本缩进

– 一位路透社记者在楠格哈尔省Surkhrod地区,村民说袭击发生,说阿富汗警方向人群开枪后,其中一些开始扔石头在当地政府大楼。 在上面的段落中,我想使用CSS来创build第一行之后的所有行,以便自动缩进一些空格,以便每行在第一行之后保持正确。 HTML <p> – A Reuters reporter in Surkhrod district in Nangarhar province, where villagers said the raids took place, said Afghan police fired at the crowd after some of them started throwing stones at local government buildings.</p> 这与列表位置设置为外部的列表项类似,但我不想使用列表。 为了达到这个效果,最简单的方法是什么? 更less的额外的HTML标记会更好。 非常感谢大家。

把search图标靠近文本框使用引导

我使用引导默认文本框采取全列的宽度,我想把search图标结束文本框。 我的代码是这样的: <div class="container"> <div class="row"> <div class="form-group col-lg-4"> <label class="control-label">Name</label> <input id="txtName" class="form-control input-sm" /> <span class="glyphicon glyphicon-search"></span> </div> <div class="col-lg-4"></div> <div class="col-lg-4"></div> </div> </div> 我不想使用input组。 请build议一个替代方式或替代HTML与CSS。

造型引导工具提示上的箭头

我试图风格tootltips使用 .tooltip-inner{} 但我有麻烦,因为我找不到如何样式工具提示小箭头。 如截图所示,工具提示的箭头是黑色的,我想添加新的颜色: 有什么build议?

DIV高度设置为屏幕百分比?

我正在设置父DIV为完整100%屏幕高度的70%。 我已经设置了下面的CSS,但它似乎没有做任何事情: body { font-family: 'Noto Sans', sans-serif; margin: 0 auto; height: 100%; width: 100%; } .header { height: 70%; } 出于某种原因,它似乎并没有工作,但标题不是屏幕尺寸的70%。 有什么build议?