Questions tagged «css»

CSS(层叠样式表)是一种表示样式表语言,用于描述HTML(超文本标记语言),XML(可扩展标记语言)文档和SVG元素的外观和格式,包括(但不限于)颜色,布局,字体,和动画。它还描述了如何在屏幕,纸张,语音或其他媒体上呈现元素。

5
简写背景属性(CSS3)中的background-size
我想混background-image,并background-size在缺兵少将的性能background特性。基于W3C的文档 background-size应background-position以斜杠(/)分隔属性之后。 W3C示例: p { background: url("chess.png") 40% / 10em gray round fixed border-box; } 等效于: p { background-color: gray; background-position: 40% 50%; background-size: 10em 10em; background-repeat: round round; background-clip: border-box; background-origin: border-box; background-attachment: fixed; background-image: url(chess.png) } MDN说了同样的话。我也发现了这个和这个文章关于速记CSS3的背景属性解释这一点。 但这是行不通的!它也并不清楚如何做一个速记background属性时background-size,并background-position有两个不同的值background-position-x,并background-position-y用于或同样的事情background-size。尚不清楚slash(/)是如何发生的?此示例在我的Chrome 15中无法正常运行。 我试图简化的示例是此CSS代码: div { background: url(http://www.placedog.com/125/125) 0 0 / 150px …
112 css 

8
如何更改HTML / CSS中的文本透明度?
我是HTML / CSS的新手,我想将某些文本显示为50%透明。到目前为止,我已经有了HTML来显示完全不透明的文本 <html><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></html> 但是,我不确定如何更改其不透明度。我尝试过在线查找,但是我不确定该如何处理找到的代码。
112 html  css  opacity 

7
如何在Mac上的Safari中删除选择元素的光泽?
在Mac和iOS设备上,在Safari中,<select>具有背景颜色的元素会在其自身上方产生光泽。在其他操作系统中似乎不会发生这种情况。 例如,我有一个具有以下样式属性的select元素: select { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 3px 6px; margin: 10px 0 7px; width: 250px; background-color: #BD2786; color: white; letter-spacing: -.04em; font-weight: bold; border: 0; } 我的元素具有所需的背景色,但光泽仍然存在。有谁知道如何使其成为纯色?

3
如何在Eclipse中集成CSS预处理?[关闭]
关闭。此问题不符合堆栈溢出准则。它当前不接受答案。 想改善这个问题吗?更新问题,使其成为Stack Overflow 的主题。 5年前关闭。 改善这个问题 我想在Eclipse中编辑SCSS文件,最好使用.scss文件的语法突出显示。 我发现这些资源很有价值: http://sass-lang.com/editors.html-没有用于.scss文件的编辑器。 http://colorer.sourceforge.net/eclipsecolorer-仅具有.scss文件 如何在Eclipse编辑器中集成SCSS开发? 或者,更一般而言,如何将CSS预处理器集成到Eclipse中?


10
Internet Explorer 9中的渐变
是否有人知道IE9中渐变的供应商前缀,还是我们仍然应该使用他们的专有过滤器? 我为其他浏览器提供的是: background-image: -moz-linear-gradient(top, #444444, #999999); /* FF3.6 */ background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #444444),color-stop(1, #999999)); /* Saf4+, Chrome */ filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999'); /* IE6,IE7 */ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999')"; /* IE8 */ 另外,有人知道Opera的供应商前缀吗?



4
Bootstrap 4:下拉菜单在屏幕右侧关闭
我似乎无法获得下拉菜单项以不离开页面。我尝试了BS3的一些功能,但它们似乎不起作用。我不确定是否是因为ml-auto。(忽略if-else语句) 这是CodePen: <div class="container-fluid"> <nav class="navbar fixed-top navbar-toggleable-md navbar-inverse" style="background-color: #3c763d!important;"> <button class="navbar-toggler navbar-toggler-right navbar-toggler-custom" type="button" data-toggle="collapse" data-target="#searchNav" aria-controls="searchav" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <!-- <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarToggleExternalContent" aria-controls="navbarToggleExternalContent" aria-expanded="false" aria-label="Toggle navigation"> <span …


9
如何在Twitter的bootstrap 2.1.0中使用新的词缀插件?
关于该主题的引导文档使我有些困惑。我想实现类似的行为,例如在文档中带有词缀navbar:navbar位于段落/页面标题下方,向下滚动时,它应该首先滚动直到到达页面顶部,然后固定在那里以便进一步向下滚动。 由于jsFiddle不适用于导航栏概念,因此我以最小的示例设置了单独的使用页面:http : //i08fs1.ira.uka.de/~s_drr/navbar.html 我将其用作导航栏: <div class="navbar affix-top" data-spy="affix" data-offset-top="50"> <div class="navbar-inner"> <div class="container"> <div class="span12"> <a class="brand" href="#">My Brand</a> This is my navbar. </div> </div> <!-- container --> </div> <!-- navbar-inner --> </div> <!-- navbar --> 我想我想data-offset-top将其值设为0(因为该条应“固定”在最顶部”,但如果设置为50,则至少可以看到一些效果。 如果还将javascript代码放在适当的位置: <script> $(document).ready (function (){ $(".navbar").affix (); }); </script> 任何帮助表示赞赏。

5
在youtube iframe上覆盖不透明div
如何在youtube iframe嵌入式视频上叠加具有半透明不透明度的div? <iframe class="youtube-player" type="text/html" width="520" height="330" src="http://www.youtube.com/embed/NWHfY_lvKIQ" frameborder="0"></iframe> <div id="overlay"></div> 的CSS #overlay { position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.8; /*background:rgba(255,255,255,0.8); or just this*/ z-index:50; color:#fff; } 编辑(添加更多说明): HTML5正在接近我们,越来越多的设备使用它而不是Flash,这使youtube视频的嵌入变得复杂,幸运的是,youtube提供了一种特殊的可嵌入iFrame,可以处理所有视频嵌入兼容性问题,但是现在,以前使用半透明div覆盖视频对象的方法不再有效,我现在无法<param name="wmode" value="transparent">向该对象添加a ,因为它现在是iFrame,因此我该如何在其顶部添加不透明的div iframe嵌入式视频?
110 html  css  iframe  youtube  overlay 


1
hidden属性(HTML5)和display:none规则(CSS)有什么区别?
HTML5具有新的全局属性,hidden可用于隐藏内容。 <article hidden> <h2>Article #1</h2> <p>Lorem ipsum ...</p> </article> CSS具有display:none规则,也可以用来隐藏内容。 article { display:none; } 在视觉上,它们是相同的。在语义上有什么区别?计算上? 在何时使用一种或另一种时,我应该考虑哪些准则? TIA。 编辑:根据@newtron的响应(如下),我进行了更多搜索。该hidden属性去年受到激烈争论,并且(显然)几乎没有使其成为HTML5规范。有人认为这是多余的,没有目的。据我所知,最终的评估结果是:如果我仅针对Web浏览器,则没有区别。(甚至有一个页面断言,Web浏览器曾经display:none用于实现hidden属性。)但是,如果我正在考虑可访问性(例如,也许我希望屏幕阅读器可以读取我的内容),则存在区别。CSS规则display:none可能会在网络浏览器中隐藏我的内容,但会使用相应的aria规则(例如,aria-hidden="false")可能会尝试阅读它。因此,我现在同意@newtron的答案是正确的,尽管可能(可以说)不像我想的那么清晰。感谢@newtron的帮助。
110 css  html  visibility 

16
使用换行符时删除HTML元素之间的空格
我有一行大约10 imgs的页面。为了提高HTML的可读性,我想在每个img标签之间插入一个换行符,但是这样做会在图像之间呈现空白,这是我所不希望的。除了在标签中间而不是在标签中间打断之外,我还能做些其他事情吗? 编辑:这是我到目前为止的屏幕截图。我希望使用PHP以随机组合显示书脊图像。这就是为什么我需要单独的img标签的原因。
110 html  css  image 

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.