什么是在CSS中的等同物：添加内容到一个元素是`content：“文本添加”;`从元素中删除内容是`?????`

有一个名为Item:的自定义名称空间我编辑的wiki，并且投诉是该名称空间内的每个页面显示为Item:This_item - Item:That_item - Item:Foo_item。什么是在CSS中的等同物：添加内容到一个元素是`content：“文本添加”;`从元素中删除内容是`?????`

我就通过网络和对于皮肤的CSS冲浪，和碰到：

span#ca-nstab-main:before, 
span#ca-nstab-user:before, 
span#ca-nstab-wp:before { 
content: "[ "; 
} 
span#ca-talk:before { 
content: "& "; 
} 
span#ca-talk:after { 
content: " ]"; 
}

这需要命名空间名称“我会用main作为例子”，并相应talk页面名称和使它们显示为[ main & talk ]而不是main talk。

我想知道是否有类似的东西可以让我显示Item:Foo只是Foo剥离“Item:”。我知道类别页面上列出的项目在div#mw-pagesa标签中。

也许甚至是一种使用JavaScript去掉前五个字符的内联方式？我说“内联”，因为$wgAllowUserJs在这个wiki上设置为false。

编辑：维基核心解析它作为：

<style type="text/css"> 
/*<![CDATA[*/  
a[title^=&quot;Item:&quot;] { 
    font-family: 'Lucida Grande', Geneva, Arial, Verdana, monospace; 
    font-size: 12px; 
    display: inline-block; 
    overflow: hidden; 
    text-indent: -2.1em; 
} 
/*]]>*/  
</style>

如何让我的报价不能被解析，有一招？我可以使用单引号而不是像font-family行那样的双引号吗？

来源

2012-04-19 ShoeMaker

哎哟！请缩进您的代码并将您的问题分成段落。否则，人们可能无法回答你的问题。 :) – Alerty 2012-04-19 23:52:12

按照你的要求。：D – ShoeMaker 2012-04-20 00:08:18

如果你只能使用CSS，你可以尝试这样的事情。（http://jsfiddle.net/zPJHU/）

li a { 
/* monospace fonts may be more consistant cross browsers */ 
font-family: "Courier New", monospace; 
font-size: 1em; 
display:inline-block; 
overflow:hidden; 
text-indent: -2.9em; /* may have to play with this value */ 
} 
li a:hover{ 
    font-size: 1.8em; /* just for demonstration of font-size increase */ 
}

演示标记：

<p>Hover over links to increase font-size</p> 
<ul> 
    <li><a href="#Item:wicket" title="This really says: 'Item:Wicket'">Item:Wicket</a></li> 
    <li><a href="#Item:chewbacca" title="This really says: 'Item:Chewbacca'">Item:Chewbacca</a></li> 
    <li><a href="#Item:obiwan" title="This really says: 'Item:Obi Wan Kenobi'">Item:Obi Wan Kenobi</a></li> 
</ul>

来源

2012-04-20 01:16:40 ralgh

我喜欢它;有没有一种方法可以测试，只有在名称以'Item：'开始时才应用文本缩进？ – ShoeMaker 2012-04-20 01:42:26

你可以像这样定位“标题”属性：a [title^=“Item：”]。更新小提琴示例：http://jsfiddle.net/zPJHU/1/ – ralgh 2012-04-20 02:02:09

请参阅我的OP上的编辑。评论框不会让我格式化一个块。 – ShoeMaker 2012-04-20 02:21:46

说不上来，如果这样的作品，但你可以prepand和追加的跨度打开/关闭标签在正确的位置，有以下几点：

<span class="hideme">Foo:</span>Bar

正如我已经说过我还没有尝试过，但我不知道另一种方式，并且可能没有可能通过使用CSS来剪切内容。 JavaScript应该做到这一点。

来源

2012-04-19 23:55:34 Hajo

页面上的实际html显示为：'Item:Foo bar'。那么，你的建议如何工作？我只是想将其更改为'Foo bar'（从title和innerHTML中剥离“Item：”）。 – ShoeMaker 2012-04-20 00:10:58

更改标题属性可能无法使用CSS。如果一个href包含一个id，那么它可以通过javascript访问。 – Hajo 2012-04-20 00:21:05

正如我上面输入的那样，它由wiki-core解析出来。没有名称或id属性。 – ShoeMaker 2012-04-20 00:47:18

什么是在CSS中的等同物：添加内容到一个元素是`content：“文本添加”;`从元素中删除内容是`?????`

回答

相关问题