Questions tagged «css»

什么是使文本变为斜体的正确方法？我已经看到以下四种方法： <i>Italic Text</i> <em>Italic Text</em> <span class="italic">Italic Text</span> <span class="footnote">Italic Text</span> <i> 这是“老办法”。<i>没有语义含义，仅传达使文本变为斜体的表示效果。据我所知，这显然是错误的，因为这是非语义的。 <em> 这仅出于表达目的而使用语义标记。碰巧<em>默认情况下会以斜体显示文本，因此那些意识到<i>应避免但不知道其语义含义的人经常使用它。并不是所有的斜体文本都是斜体的，因为它是强调的。有时，它可能恰好相反，例如旁注或耳语。 <span class="italic"> 这使用CSS类放置演示文稿。这经常被吹捧为正确的方法，但是对我来说，这似乎又是错误的。这似乎并没有传达出更多的语义含义<i>。但是，它的支持者大声疾呼，如果您说想要大胆的话，以后更改所有斜体文本要容易得多。事实并非如此，因为那时我将剩下一个称为“斜体”的类，该类使文本变为粗体。此外，目前尚不清楚为什么我要更改我网站上的所有斜体文本，或者至少我们可以想到这种情况是不希望或没有必要的。 <span class="footnote"> 这将CSS类用于语义。到目前为止，这似乎是最好的方法，但实际上存在两个问题。 并非所有文本都有足够的含义来保证语义标记。例如，页面底部的斜体文本真的是脚注吗？还是放在一边？或完全其他的东西。也许它没有特殊的含义，只需要用斜体将其表示形式与前面的文本分开即可。 如果没有足够的强度，语义可能会发生变化。可以说，我跟着“脚注”是基于页面底部的文字。如果几个月后我想在底部添加更多文本，会发生什么？它不再是脚注。我们该如何选择一个语义类，该语义类的通用性要小于<em>但避免了这些问题？ 摘要 似乎在许多情况下，对语义的要求似乎过于繁重，在这些情况下，使斜体字的意图并不意味着带有语义。 此外，将样式从结构中分离出来的愿望导致CSS被吹捧为<i>在某些情况下实际上用处不大的替代品。因此，这让我留下了谦卑的<i>标签，并且想知道这种思路是否是将其保留在HTML5规范中的原因？ 是否有关于此主题的好的博客文章或文章？可能是由那些决定保留/创建<i>标签的人员参与的？

202 html  css  semantic-markup 

有没有一种方法可以完全禁用边距收缩？我发现的唯一解决方案（名称为“ uncollapsing”）需要使用1px边框或1px填充。我发现这是不可接受的：无关紧要的像素无缘无故使计算复杂化。有没有更合理的方法来禁用此保证金倒塌？

202 css  margin  collapse 

我想淡出一个元素（将其不透明度转换为0），然后在完成后从DOM中删除该元素。 在jQuery中，这很简单，因为您可以指定动画完成后进行的“删除”操作。但是，如果我希望使用CSS3过渡进行动画处理，是否可以知道过渡/动画何时完成？

202 javascript  jquery  css 

在Firefox 28上，我使用的<input type="number">作品很棒，因为它在仅应包含数字的输入字段上弹出了数字键盘。 在Firefox 29中，使用数字输入会在字段的右侧显示旋转按钮，这在我的设计中看起来像废话。我真的不需要按钮，因为当您仍然需要编写6到10位数的数字时，它们是无用的。 是否可以使用CSS或jQuery禁用此功能？

202 jquery  css  firefox  input  spinner 

我有一个用于收件箱的简单表，如下所示： <table border="1"> <tr> <th>From</th> <th>Subject</th> <th>Date</th> </tr> 如何设置宽度，以使“开始”和“日期”为页面宽度的15％，“主题”为70％。我还希望表格占据整个页面的宽度。

202 html  css  html-table 

这是我的HTML： <select id="ddlProducts" name="ddProducts"> <option>Product1 : Electronics </option> <option>Product2 : Sports </option> </select> 我想仅使用CSS将产品名称（即“ Product1”，“ Product2”等）加粗，并将其类别（例如，电子，体育等）斜体化。我发现一个老问题，提到无法使用HTML和CSS，但希望现在有解决方案。

202 html  css  drop-down-menu 

当鼠标移到a <tr>中时，如何更改光标指针<table> <table class="sortable" border-style:> <tr> <th class="tname">Name</th><th class="tage">Age</th> </tr> <tr><td class="tname">Jennifer</td><td class="tage">24</td></tr> <tr><td class="tname">Kate</td><td class="tage">36</td></tr> <tr><td class="tname">David</td><td class="tage">25</td></tr> <tr><td class="tname">Mark</td><td class="tage">40</td></tr> </table>

201 html  css  cursor 

有序列表能否使用CSS生成看起来像1.1、1.2、1.3（而不只是1，2，3，...）的结果？到目前为止，使用list-style-type:decimal仅产生了1、2、3，而不是1.1、1.2、1.3。

201 html  css 

我敢肯定有一个解决此问题的简单方法。基本上，如果我有两列，如何在它们之间添加一个空格？ 例如，如果html是： <div class="col-md-6"></div> <div class="col-md-6"></div> 输出将是彼此相邻的两列，占据了页面的整个宽度。假设将宽度设置为，1000px则每个div都会很500px宽。 如果我想在100px两者之间留出空间，该如何实现？显然，通过引导程序自动使div大小成为450px补偿大小的每个大小

201 html  css  twitter-bootstrap-3  grid-layout 

我有一个div容器，其定义如下： div#tbl-container { width: 600px; overflow: auto; scrollbar-base-color:#ffeaff } 填充此div包含的表格后，这将自动为我提供水平和垂直滚动条。我只希望仅水平滚动条自动显示。我将以编程方式修改桌子的高度。 我该怎么做呢？

200 css  html 

我尝试fieldset使用display: flex和设置元素的样式display: inline-flex。 然而，它没有工作：flex表现得像block，并inline-flex表现得像个inline-block。 这种情况在Firefox和Chrome上均会发生，但奇怪的是，它在IE上有效。 是虫子吗？fieldset在HTML5和CSS Flexible Box Layout规范中，我都找不到应该有的特殊行为。 fieldset, div { display: flex; border: 1px solid; } <fieldset> <p>foo</p> <p>bar</p> </fieldset> <div> <p>foo</p> <p>bar</p> </div> 运行代码段Hide results展开摘要

200 html  css  flexbox 

如果我有标题标签 <h1 class="hc-reform">title</h1> h1.hc-reform{ float:left; font-size:30px; color:#0e73bb; font-weight:bold; margin:10px 0px; } 之后我有一个段落<p>stuff here</p>。 如何确保使用CSS可以使用<p>紧随其后的每个标记h1.hc-reform：clear:both; 会是： h1.hc-reform > p{ clear:both; } 由于某些原因无法正常工作。

200 html  css  css-selectors  siblings 

我有一个包装div，彼此相邻地包含2个div。在此容器上方，我有一个包含我的标头的div。包装div必须为100％减去标题的高度。标头约为60像素。这是固定的。所以我的问题是：如何将包装div的高度设置为100％减去60像素？ <div id="header"></div> <div id="wrapper"> <div id="left"></div> <div id="right"></div> </div>

199 css  height 

我知道我可以通过JavaScript 设置 CSS值，例如： document.getElementById('image_1').style.top = '100px'; 但是，我可以获得当前的特定样式值吗？我已经读到了可以获取元素整个样式的地方，但是如果不需要的话，我不想解析整个字符串。

199 javascript  css 

我正在为一款软件编写插件，该插件需要大量项目并将其弹出到Cocoa中的WebView中的HTML中（该WebView使用WebKit作为其渲染器，因此基本上您可以假定正在以下位置打开该HTML文件）苹果浏览器）。 它制作的DIV具有动态高度，但变化不大。它们通常在200像素左右。无论如何，每个文档中有大约六百个这样的项目，所以我很难过要打印它。除非我很幸运，否则每页底部和顶部都有一个条目被切成两半，这使得使用打印输出变得非常困难。 我尝试过分页之前，分页之后，分页内部以及这三者的组合均无济于事。我认为可能是WebKit无法正确呈现指令，或者可能是我对如何使用它们缺乏了解。无论如何，我需要帮助。打印时如何防止DIV切入一半？

199 css  cocoa  printing  page-break