Tag: CSS

如何用转换创build一个React模态(附加到`<body>`)?

在这个答案中有一个模式,通过将它附加到<body>来创build一个基于React的模态。 但是,我发现它与React提供的过渡插件不兼容。 如何创build一个与转换(在进入和离开)?

使用Bootstrap嵌套列表的一致样式

有没有办法让twitter bootstrap中的嵌套列表看起来像一个普通的列表,嵌套的项目简单地缩进(并适用于任意深嵌套)? 默认情况下,嵌套列表如下所示 : <ul class="list-group"> <li class="list-group-item">One</li> <li class="list-group-item">Two <ul class="list-group"> <li class="list-group-item">Item 2a</li> <li class="list-group-item">Item 2b</li> </ul> </li> <li class="list-group-item">Three <ul class="list-group"> <li class="list-group-item">Item 3a</li> <li class="list-group-item">Item 3b</li> </ul> </li> </ul> 我怎样才能使这些嵌套列表像这样(或以类似的方式)出现: 如果你错过了上面的链接,这里是JSFiddle: https ://jsfiddle.net/7o8rp0kv/1/

CSS:中心块,但内容alignment左侧

我想要一个整体的块居中在其父,但我希望该块的内容左alignment。 例子服务最好 在本页 : http://yaml-online-parser.appspot.com/?yaml=%23+ASCII+Art%0d%0a—+%7c%0d%0a++%5c%2f%2f%7c%7c%5c% 2F%7C%7C%0D 0A%++%2F%2F +%7C%7C ++%7C%7C __%0D 0A%&types=蟒 ascii艺术应该居中(看起来),但它应该排队,看起来像“YAML”。 或这个 : http://yaml-online-parser.appspot.com/?yaml=%3f+-+Detroit+Tigers%0d%0a++-+Chicago+cubs%0d%0a%3a%0d%0a++-+2001-07-23 0D%0A%0D%0A%%3F +%5B +新+纽约洋基+ 2C%0D%0A%亚特兰大++++ +勇士+%5D 0D%0A%3A%+%5B + 2001年7月2日%2C + 2001年8月12日%2C%0D 0A%++++ 2001年8月14日+%5D%0D 0A% 错误信息应该像在控制台中一样排列。

jquery ui对话框固定定位

我需要对话框来保持其位置,即使页面滚动,所以我使用了http://forum.jquery.com/topic/dialog-position-fixed-12-1-2010的扩展名,但有2个问题: 它在IE浏览器和Firefox浏览器页面滚动闪烁(在Safari / Chrome的很好) 在closures然后重新打开时,它会随着页面而松弛粘滞。 这里是我用来创build对话框的代码: $('<div id="'+divpm_id+'"><div id="inner_'+divpm_id+'"></div><textarea class="msgTxt" id="txt'+divpm_id+'" rows="2"></textarea></div>') .dialog({ autoOpen: true, title: user_str, height: 200, stack: true, sticky: true //uses ui dialog extension to keep it fixed }); 这里是我用来重新打开它的代码: jQuery('#'+divpm_id).parent().css('display','block'); build议/解决scheme? 谢谢

删除所有填充和边距表HTML和CSS

我有这张桌子: <body> <table id="page" > <tr id="header" > <td colspan="2" id="tdheader" >je suis</td> </tr> <tr> <td>1</td> <td>2</td> </tr> </table> </body> 这是CSS html, body, #page { height:100%; width:100%; margin:0; padding:0; } #header { margin:0; padding:0; height:20px; background-color:green; } 我想删除所有的边距和填充,但总是我有: 我该如何解决这个问题?

有没有办法让有序列表中的数字变成粗体?

有没有任何CSSselect器只附加一些样式到有序列表的数字部分? 我有HTML像: <ol> <li>a</li> <li>b</li> <li>c</li> </ol> 应该输出: 1.a 2.b 3.c 我需要使1.,2.和3. 粗体 ,同时留下a,b,c。 我知道<span>解决方法…

ID和类的CSS最佳实践?

我一直在关注CSS的SitePoint书。 让我感到震惊的是,使用ID作为CSSselect器。 我已经做了一些CSSdevise,我总是发现使用Class作为select器更容易,更通用。 也许它是一个.NET的东西,因为我们并不总是有一个元素的ID的控制… 在这里最好的做法是使用CLASS或ID作为select器?

水平滚动的CSS?

我想有一个具有横向滚动的ID <div> ,但问题是它必须是响应,而不是固定的宽度。 html, body {margin: 0; padding: 0;} #myWorkContent{ width:530px; height:210px; border: 13px solid #bed5cd; overflow-x: scroll; overflow-y: hidden; white-space: nowrap; } #myWorkContent a { display: inline-block; vertical-align: middle; } #myWorkContent img {border: 0;} <div id="myWorkContent"> <a href="assets/work/1.jpg"><img src="http://placekitten.com/200/200/" height="190"></a> <a href="assets/work/2.jpg"><img src="http://placekitten.com/120/120/"/></a> <a href="assets/work/3.jpg"><img src="http://placekitten.com/90/90/" height="90" width="90"></a> <a href="assets/work/4.jpg"><img src="http://placekitten.com/50/50/" height="190"></a> <a href="assets/work/5.jpg"><img […]

Chrome使用固定位置元素慢速滚动

在我的顶部有一个固定的DIV,底部有3个固定的标签和一个固定的div(这只在login后才会显示)。 我在Chrome浏览器上的滚动性能不佳 – FF和IE都很好。 我已经准备好了关于Chrome的一些问题报告,固定定位和滚动,想看看有没有人有任何build议? 我真的想要解决这些元素在他们的位置,但我也希望在Chrome浏览器中有良好的滚动性能。 任何想法解决? 注意:在放大Chrome时更显着 更新:我已经读过其他人有类似的问题,并更新了这个Chrome问题 ,后来合并到136555 ,据称从Chrome 26固定。

透明的CSS背景颜色

我想通过使用不透明度而不影响字体来使列表菜单消失。 用CSS3可以吗?