Google Chrome：对角线CSS直通 [英] Google Chrome: Diagonal CSS line-through

问题描述

我只是想知道这是否以某种方式c​​ss属性：

I just wondered if this is in some way a css attribute:

http://dl.dropbox.com/u/14645664/fhjfhgf.JPG

Does anyone know ?

解决方案

Nope, this is definitely not CSS.

However, that doesn't mean you can't do something similar with CSS. Start with an element with a specific class, like "slashed":

<span class="slashed">True?</span>

Then, CSS pseudo elements/selectors to the rescue!

.slashed:before {
    content:"╱";   
    display:block;
    color:red;
    font-size:2em;
    position:relative;
    left:1em;
    top:5px;
  }

Note that the slash used in the CSS is "╱", not "/", as it gives a better slash effect. You can obviously tweak it by changing the top, left, and font-size properties. The end result looks like:

Note that CSS :before won't work in IE7 below, and other (much) older browsers, so you'll want to have some sort of fallback.

http://jsbin.com/ohuxig/edit#html,live

这篇关于Google Chrome：对角线CSS直通的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！