HTML いくつかの特別な分割線効果

HTML いくつかの特別な分割線効果

1. 基本ライン


2. 特殊効果(効果は独立しておらず、互いに組み合わせることができます)
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>


3. 右側の段階的な透明度:
<HR style="FILTER: alpha(opacity=100,finishopacity=0,style=1)" width="80%" color=#987cb9 SIZE=3>


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>


8. スチール針効果:
<HR style="FILTER: progid:DXImageTransform.Microsoft.Glow(color=#987cb9,strength=10)" width="80%" color=#987cb9 SIZE=1>


9.垂直分割線
<table border="1px" cellpadding="0" cellspacing="0" style="height:265px;border-left-style:solid; border-bottom-style:none;border-right-style:none;border-top-style:none">


<HR align=center width=300 color=#987cb9 SIZE=1>
線の位置を揃える(オプション:左、右、中央); 幅 線の長さ; 色 色; サイズ 太さ

<<:  CSSスタイルとセレクターの使い方

>>:  JavaScript 正規表現の説明

推薦する

nginxはdockerコンテナ内に設定ファイルを自動的に生成します

企業が Docker 自動デプロイメントを構築する場合、Docker の実行時にコンテナ内の設定ファ...

Javascriptのクロージャとアプリケーションの詳細な説明

目次序文1. クロージャとは何ですか? 1.1 クロージャは条件コードを満たす1.2 クロージャ生成...

MySQLの大規模テーブル最適化ソリューションについての簡単な説明

背景Alibaba Cloud RDS for MySQL(MySQL バージョン 5.7)データベ...

負荷分散の基礎知識とnginxを使用した負荷分散の簡単な例

Nginx は、一般的に 7 層の負荷分散に使用できます。この記事では、負荷分散に関する基本的な知識...

React における setState の同期または非同期の問題の理解

目次1. setState は同期的ですか?非同期ですか? 2. 非同期的に動作する1. React...

href をクリックした後にページがジャンプしないようにするための空のリンクの正しい書き方 # 問題

リンクを使用する必要がある場合もありますが、リンクする必要はありません。onclick イベントを処...

Zabbixで監視する必要があるホストを追加するための詳細な手順

監視ホストの追加ホスト 192.168.179.104 が zabbix 監視項目に追加されます (...

HTML タイトルに二重引用符を追加する方法

<a href="https://www.jb51.net/" title...

要素テーブルの多層ネスト表示の実践

複数の注文を含むリストが必要です。各注文は一意にすることも、複数の注文を結合することもできます。各注...

JSで実現したページサイドバーの効果に関する研究

目次発見: ディスプレイアニメーションの応用実装:記事の1行目を表示する効果を実現する方法実際、その...

MySQLデータベースの使用仕様の概要

導入: MySQL データベースの仕様に関しては、皆さんも何らかのドキュメントを読んだことがあると思...

CentOS システムでの JDK のインストールと設定の概要

目次序文OpenJDKの確認とアンインストールダウンロードした圧縮パッケージを使用してJDKをインス...

js の parseInt() の奇妙な動作の調査と修正

背景: parseInt(0.006) または parseInt(0.0006) は 0 という値を...

Node8 における AsyncHooks 非同期ライフサイクル

Async Hooks は Node8 の新機能です。NodeJs の非同期リソースのライフサイクル...

古典的なスネークゲームの JavaScript 実装

この記事では、古典的なスネークゲームを実装するためのJavaScriptの具体的なコードを参考までに...