0

我有一个有序列表，其中显示了排名靠前的用户，他们的对应点向右对齐。示例：http ://codepen.io/anon/pen/EkKJC 。
当视口太小时，我想隐藏用户名的溢出部分。我不能使用百分比，因为它们不准确。我也不能使用固定宽度，因为内容是动态的。
这里的主要问题是透明背景（是的，它必须是透明的），因为使用 z-index 不起作用。
我需要一个跨浏览器、语义、纯 CSS 和无嵌套标签的解决方案来解决这个问题，或者至少是 IE7+。或者也许是另一种处理这种情况的方法。

顺便说一句，我想知道是否有必要（从语义的角度）给出<span>一个类名，即使我知道<span>. 提前致谢。<li>

4

3 回答 3

0

如果您不需要使用 javascript 或其他东西来引用跨度，那么不需要，您不必给它一个类名。但是您还必须确信该站点上也不会有任何其他<ol>内容，我倾向于给出<ol>#topusers 的ID

ol#topusers {
  list-style: inside decimal;
  width: 300px;
}

ol#topusers li span {
  float: right;
}
于 2013-01-20T06:23:42.007 回答
0 
body, footer {
background: url('http://static3.depositphotos.com/1000635/110/v/450/dep_1104872-Helix-seamless-pattern..jpg') fixed repeat 100% 100%;
}

假设页脚必须透明的原因是因为背景图像。

或者，将

body {
padding-bottom:(the footer height here);
}

在这里帮忙？

于 2013-01-20T06:28:29.497 回答
0

您可以使用 css 的 opacity 属性来隐藏透明元素后面的内容。

将内容放在 div 元素中，然后设置该 div 的不透明度。谢谢。

于 2013-01-20T07:29:31.823 回答