HTML 特殊な分割線エフェクトをいくつか紹介します。
I. 基本線
II. 効果(効果は単独ではなく、互いに組み合わせることができる)
1. 両端のグラデーション透明度。
<HR style="FILTER: alpha(opacity=100,finishopacity=0,style=3)" width="80%" color=#987cb9 SIZE=3>
2. スピンドル形状。
<HR style="FILTER: alpha(opacity=100,finishopacity=0,style=2)" width="80%" color=#987cb9 SIZE=10>.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX;
3. 右のグラデーションの透明度。
<HR style="FILTER: alpha(opacity=100,finishopacity=0,style=1)" width="80%" color=#987cb9 SIZE=3>.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX;
4. 左のグラデーションは透明です。
<HR style="FILTER: alpha(opacity=0,finishopacity=100,style=1)" width="80%" color=#987cb9 SIZE=3>
5. 破線です。
<HR style="border:1 dashed #987cb9" width="80%" color=#987cb9 SIZE=1>
6. 二重線。
<HR style="border:3 double #987cb9" width="80%" color=#987cb9 SIZE=3>
7. ステレオ効果。
<HR style="FILTER: progid:DXImageTransform.Microsoft.Shadow(color:#987cb9,direction:145,strength:15)" width="80%" color=#987cb9 SIZE=1>.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX.XXX;
8. 鋼鉄の針効果。
<HR style="FILTER: progid:DXImageTransform.Microsoft.Glow(color=#987cb9,strength=10)" width="80%" color=#987cb9 SIZE=1>.XXXXXXX.XXXXXXXXX.XXXXXXX.XXXXXXX;
<スパン
<HR align=center width=300 color=#987cb9 SIZE=1>
align 行の位置(左、右、中央は任意); width 行の長さ; color 色; size 太さ
関連
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
HTMLファイルに外部CSSファイルを導入する際のパスのまとめ
-
html meta viewport 属性の説明
-
柔軟で安定した高品質のHTMLとCSSコード仕様の書き方ガイド
-
INSとDELのタグ付きドキュメントを使用して、使用内容を変更することができます。
-
htmlと埋め込みFlashの両方にスクロールバーがある場合の解析と対処法
-
Framesetのワイドスクリーン・センターリングを使用するためのヒントを共有する。
-
HTMLページでjs、cssファイルのキャッシュを自動でクリーンアップ(バージョン番号を自動で付与)。
-
HTMLのテーブルタグと関連する改行の問題を徹底分析
-
htmlフォームのいくつかの送信方法のまとめ