Questions tagged «css»

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

4
悬停<button>标签时如何使光标变为手形
在查看我的网站时，光标只会变为带有&lt;a&gt;标签的带手套的手，而不是&lt;button&gt;带有标签的。是否有一个原因？ 这是我的代码（在css3中，按钮标签的ID为#more）。 #more { background:none; border:none; color:#FFF; font-family:Verdana, Geneva, sans-serif; }
72 css  mouse-cursor 
11
IE9上的框阴影无法使用正确的CSS呈现，可在Firefox，Chrome上使用
我正在尝试模拟浮动模式框类型的东西，但IE9及其框阴影实现存在问题。 这是我正在使用的代码的摘要，可重复出现的问题： &lt;html&gt; &lt;head&gt; &lt;title&gt;Sample page&lt;/title&gt; &lt;style&gt; .content-holder { border-collapse: collapse; } .back { background-color: #a8c0ff; padding: 100px; } .inner { background-color: #fff; text-align: center; padding: 50px; box-shadow: 0px 0px 20px #000; } &lt;/style&gt; &lt;/head&gt; &lt;body&gt; &lt;table class="content-holder"&gt; &lt;tr&gt; &lt;td&gt; &lt;div class="back"&gt; &lt;div class="inner"&gt; &lt;h2&gt;Heading&lt;/h2&gt; &lt;p class="subtext"&gt;Some text here&lt;/p&gt; &lt;p&gt;More …
5
您可以在Firebug中将鼠标悬停在“粘滞状态”吗？
当我调试站点时，有时悬停的选择器有点长，并且与其他选择器类似，是否可以将一种“粘性”状态应用于Firebug中的悬停规则？ 例; 我将鼠标悬停在导航栏上，并希望将选择器从Firebug中复制出来以在CSS中进行搜索，但是一旦移动鼠标，选择器（显然）就会消失，因为导航&lt;li&gt;不再悬停了。 有什么办法吗？ 谢谢 ：）
71 html  css  firefox  firebug  hover 
8
像在使用iPhone的CSS和jQuery的Instagram iPhone应用程序中那样，获得一个粘性标题以“推动”
Instagram应用程序具有一个不错的粘性标头，可以将当前的标头推上新标头。我找到了一个很棒的教程，说明如何在Android平台上原生执行此操作，但我希望使用JavaScript和CSS来完成。 我能够让标题切换到新标题，但似乎找不到模仿Instagram的方式。任何帮助是极大的赞赏。 *编辑：当使用指出的注释中的Cj作为航路点滚动时，我能够使标题停留在页面顶部。（链接至路标）。我遇到的主要问题是获得instagram在其iPhone移动应用程序中使用的“推动”效果。我会链接到一个示例，但我从未见过使用它。* * *编辑2：使用@Chris提供的部分代码笔，可以使标头粘贴。然后，我添加了.slideUp效果。我的问题现在是使.slideUp效果仅在到达下一个标头时发生。现在，效果会在滚动上激活。 这是代码： (function() { function stickyTitles(stickies) { this.load = function() { stickies.each(function(){ var thisSticky = jQuery(this); jQuery.data(thisSticky[0], 'pos', thisSticky.offset().top); }); } this.scroll = function() { stickies.each(function(){ var thisSticky = jQuery(this), pos = jQuery.data(thisSticky[0], 'pos'); if (pos &lt;= jQuery(window).scrollTop()) { thisSticky.addClass("fixed"); // added this $(".followMeBar:parent").slideUp(); } else …
12
在OS X上的Firefox中，Bootstrap 3 Styled Select下拉菜单看起来很难看
&lt;select&gt;在Bootstrap 3中设置表单元素的样式时，它将在OS X的Firefox中呈现一个难看的按钮： （http://bootply.com/98385） 显然，这已经是一段时间以来的已知问题了，并且有许多hack和变通办法，但没有一个很干净（ https://github.com/twbs/bootstrap/issues/765）。我想知道是否有人使用Bootstrap下拉列表或其他插件找到了解决此问题的好方法。我故意选择使用HTML&lt;select&gt;而不是Bootstrap下拉列表，因为在移动设备上使用长列表时，可用性更好。 这是Firefox问题还是Bootstrap问题？ 详细信息：Mac OS X 10.9，Firefox 25.0.1 更新12/4/13：我对每种浏览器如何&lt;select&gt;使用Firefox，Chrome和Safari在OS X 10.9上呈现的进行了并排比较，以响应@zessx（使用http://bootply.com / 98425）。显然，&lt;select&gt;表单元素在浏览器和操作系统之间的呈现方式之间存在很大差异： 我了解，&lt;select&gt;根据您使用的操作系统，对标签的处理方式有所不同，因为存在基于操作系统的本机控件来指示样式和行为。但是，class="form-control"导致Bootstrap的&lt;select&gt;表单元素在Firefox中看起来与众不同的原因是什么？为什么&lt;select&gt;Firefox中默认的未设置样式的样式看起来可以，但是一旦被设置样式，则看起来很难看？
2
页眉/页脚/导航标签-在IE7，IE8和浏览器中，不支持HTML5的标签会发生什么变化？
我很想开始特别使用Html5&lt;header&gt;/&lt;footer&gt;/&lt;article&gt;/&lt;nav&gt;标签。 如果浏览器不支持这些怎么办？ 我还需要对它们进行样式设置：例如：nav具有边框和边距等。您知道标准的CSS知识。 因此，如果我使用nav标签对它们进行样式设置，则IE7和IE8等将忽略这一点？
12
您将如何操作：表格或CSS？[关闭]
从目前的情况来看，这个问题不适合我们的问答形式。我们希望答案能得到事实，参考或专业知识的支持，但是这个问题可能会引起辩论，争论，民意调查或扩展讨论。如果您认为此问题可以改善并且可以重新提出，请访问帮助中心以获取指导。 8年前关闭。 （资源： sontag.ca） 第一部分 可以使用2个HTML表（一个嵌套在另一个中，甚至只用一个表）来非常简单地完成此布局。 也可以使用CSS来完成，尽管可能需要更多的思考。 这可能不是现实世界的布局，但我看到了相似的页面。认为这是一个谜。锻炼您的CSS技能的练习。 为了使事情变得更有趣，我在一个名为The Challenge的分为两部分的网页中对该问题进行了框架化。我们将检查代码和问题：使用表还是CSS进行布局？，并排，逐击，因为我们的两个对手为代码至上而战。 第一部分阐述了挑战的产生。我希望你喜欢。 第二部分是决策。 您可能会感到惊讶。 第二部分 发布后仅几分钟，我很快就收到了如此迅速的回答，真让我感到惊讶。这是一次令人沮丧的经历。我不希望与您竞争计时赛。 但是，话虽这么说，在仔细检查了所提供的解决方案之后，我才意识到，没有一个CSS解决方案（包括当时的我自己的）和所提供的任何一个表解决方案一样有效。挑战在于CSS优于任何表格布局解决方案而言，。 因此，我添加了3条新规则（请记住，其中一条规则是可以更改的规则）。这使某些人感到恼火。因此，我随后添加了一些有关为什么更改规则的精彩解释。我认为这使他们更加恼火。 我们的花园要围着篱笆。使它与可能遇到的沉闷环境区分开的东西；而且不太贵，但易于保持清洁。所以我想要花园周围有一个1像素的黑色边框 每个花园地块（字符）上的居民必须为黑色或白色，具体取决于哪个显示出他们的花园中最好的。而且它们都是草书血统。它们之间没有斜体。;-) 花园是可重定位的，也就是说，我可以在页面上的任何位置（没有绝对定位）拥有这个花园。 这是最终输出的样子（背景颜色可选）： （来源： sontag.ca） 我对反复无常和最后一分钟的规则表示歉意。我错了 每个花园地块的居民都是手工制作的手工匠人。他们是草书家族的后裔，他们的风格感归功于斜体。 花园必须可重定位，因为两种花园（表和CSS）都需要在同一页面上共存。我可能会说错position:absolute不允许使用规则。如果您可以让他们在这种情况下工作，那么您将获得更大的权力。他们一定会被接受。 我要求在地块周围设置围栏，因为每种花园类型都将种植在橙色背景的乡村中，该乡村背景与我们所种花朵的颜色非常相似。 我现在住在荷兰，郁金香季节快到了。如果您在接下来的几周内飞越荷兰，而且天气晴朗（这里很少见），那么您下面的风景将看起来很像这项愚蠢的练习。 我并不喜欢橙色，但我喜欢并欣赏荷兰人，所以这就是为什么我们有橙色背景，以向东道国致敬。:-) 第三部分 我已经将《挑战》中的Ted的表格答案与这张图片一起发布了 （来源： sontag.ca） 因为可以轻松地将居住者添加到花园中，而无需触及CSS规则-一切都会自动居中。 你能用 CSS 做到吗？你能用...鲱鱼砍掉森林里最强大的树吗？ 更新：查理的答案在这里。
71 css  layout  xhtml  html-table 
10
jQuery Mobile：将页脚置于页面底部
有什么方法可以牢记jQuery Mobile框架的操作方式来固定页面，以便页脚始终与页面底部对齐-不管高度如何。 从目前的角度来看，jQuery页面的高度将发生变化，尤其是当设备从纵向旋转为横向时，因此解决方案必须考虑到这一点。 只是为了澄清-我不需要页脚位于视口的底部，而只是为了使默认页面高度不低于视口高度而工作。 谢谢。
15
如何调试CSS / JavaScript悬停问题
我经常发现自己想调试CSS布局问题，这些问题涉及Java语言引起的DOM更改，以响应悬停事件或由于：hover选择器而导致的不同CSS规则。 通常，我会使用Firebug来检查给我带来麻烦的元素，并查看其CSS属性是什么，以及这些属性来自何处。但是，当涉及到悬停时，这将变得不可能，因为一旦将鼠标移到Firebug面板上，感兴趣的元素就不再悬停，适用的CSS规则也就不同了，并且（在这种情况下， JS悬停）更改了DOM。 有没有什么办法可以“冻结” DOM和应用程序的状态：悬停，以检查DOM，因为它是在一个悬停事件？ 当然，也欢迎任何其他有关如何调试此类问题的想法。
4
jQuery-如何确定div是否更改其高度或任何CSS属性？
我想知道当div更改其高度或任何CSS属性时如何触发事件。 我有一个id =的div mainContent。我希望jQuery在更改其高度时自动触发事件。我做了这样的事情： $("#mainContent").change('height', function() { $("#separator").css('height', $("#mainContent").height()); }); 我知道错了。 这是我的整个代码（我粘贴了所有代码，因为由于某些原因我无法进入jsfiddle）： &lt;html&gt; &lt;head&gt; &lt;style type="text/css"&gt; html, body { width: 100%; height: 100%; margin: 0; padding: 0; } #separator { border-right: 1px solid black; } &lt;/style&gt; &lt;script type="text/javascript" src="jquery1.6.4min.js"&gt; &lt;/script&gt; &lt;script type="text/javascript"&gt; $(document).ready(function() { $("#separator").css('height', $("body").height()); }); $(function() { $("#btnSample1").click(function() …
71 javascript  jquery  css 
8
CSS位置：固定在定位元素内
我有一个定位的div，其内容可能太长，因此出现滚动条（overflow:auto设置）。它充当ajax应用程序中的对话框。我想在其右上角修复一个关闭按钮，以便当用户滚动div时不会滚动离开。 我尝试过，position:fixed; right:0; top:0但是它把按钮放在页面的右上角而不是div中（在Firefox中）。 是否可以仅使用CSS进行此按钮放置，而不会在每次滚动事件中都破坏js中的offsetWidth / Height？ ps：div的高度和宽度不是固定值，它取决于内容的大小和浏览器窗口的大小。用户还可以根据需要调整其大小。
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.