0

CSSだけでこれを行うことができるかどうかはよくわかりませんが、次のようになります。

要素のグループの周りに斜めの境界線を表示するために、border プロパティ (または類似のもの) を使用したいと考えています。説明する最善の方法は、次のことを示すことだと思います。

HTML:

<ul>
    <li>link</li>
    <li>link</li>
    <li>link</li>
</ul>

CSS:

li {
    border-top:1px solid black;
    border-bottom:1px solid black;
    border-right: /* ??? */ ;
}

次のように見えます:

-----------------\
link              \
-------------------\
link                \
---------------------\
link                  \
-----------------------\

プレビュー: ここに画像の説明を入力

私の知る限り、普通のCSSではこれができません。canvas や jQuery はどうですか? そこで何か助けになることはありますか？

4

3 に答える 3

1

TutsPlus (リンク) で同様のことを達成するためのかなり良いチュートリアルがあり、いくつかの微調整を行う必要があります (たとえば、クラスとパディングを追加して、毎回どんどん動いているように見せます)。

ただし、これがすべてのブラウザー、特に IE で確実に機能するとは限りません。クロスブラウザで動作させたい場合は、リスト項目の背景画像を斜めの線にしてから、各リスト項目にパディングを追加して、外側に移動しているように見せることをお勧めします.

于 2013-08-26T16:54:43.283 に答える