ホームページ  >  記事  >  ウェブフロントエンド  >  上下左右のボーダーの色が違う問題_html/css_WEB-ITnose

上下左右のボーダーの色が違う問題_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:38:551920ブラウズ

<html><head><style type="text/css">p.one {border-style: solid;border-width: 15px;border-left-color:red;min-height:50px;}</style></head><body><p class="one">...</p></body></html>


このようにして、異なる色の境界線の角と異なる色の交差部分に明らかな斜線が表示されます
Ruhe はそのような効果を実現できます


ディスカッション (解決策) に返信

2 つの方法, 1つはクリアタグを直接挿入する方法、もう1つはafterセレクターを使用する方法です。
そうですか

この効果は CSS3 を使用するとはるかに簡単です

気にしない場合は、古いブラウザと新しいブラウザと互換性を持たせるために 1 つのレイヤーをネストしてください:

100db36a723c770d327fc0aef2ce13b1
ac68354c044cd3b4f516b0952e480cfd
.ps{border-left:15px red Solid;} /* 左外側の境界線 */

p.one {
border-style: Solid;
border-width: 15px;左:なし;
位置:相対;

9c3bca370b5104690d9ef395f2c5f8d1
7ddd366bf48b731bdbcca5332d2bab6e ;p class="one">...94b3e26ee717c64999d7867364b1b4a316b28748ea4df4d9c2150843fecfba68

73a6ac4ed44ffec12cee46588e518a5e

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。