ボーダークラス
W3.CSS境界クラスは、任意のHTML要素で使用することができます。
私はすべての側面にボーダーを持っています。
私は赤の下の境界を持っています
私は国境を四捨五入しています。
例
<div class="w3-border">
<p>I have borders on all sides.</p>
</div>
<div class="w3-border-bottom w3-border-red">
<p>I have
a red bottom border.</p>
</div>
<div class="w3-border
w3-round-xlarge">
<p>I have rounded borders.</p>
</div>
<div class="w3-container w3-pale-blue w3-leftbar w3-border-blue">
<p>I have a blue leftbar.</p>
</div>
»それを自分で試してみてください メモを表示します
注意事項は、多くの場合、淡い色と色付きのバーで表示されます。
例
<div class="w3-container w3-pale-blue w3-leftbar w3-border-blue">
<p>London
is the most populous city in the United Kingdom,
with a
metropolitan area of over 13 million inhabitants.</p>
</div> »それを自分で試してみてください パネルの表示
パネルは百万の異なる方法で表示することができます。
ロンドンはイギリスの首都です。 これは、1300万人の住民の首都圏で、イギリスで最も人口の多い都市です。
ロンドンはイギリスの首都です。 これは、1300万人の住民の首都圏で、イギリスで最も人口の多い都市です。
ロンドンはイギリスの首都です。 これは、1300万人の住民の首都圏で、イギリスで最も人口の多い都市です。
例
<div class="w3-container w3-light-grey w3-border">
<p>London is the
most populous city in the United Kingdom,
with a metropolitan area
of over 13 million inhabitants.</p>
</div> »それを自分で試してみてください 引用符を表示します
W3-コンテナクラスは、引用符を表示するために使用することができます。
例
<div class="w3-container w3-leftbar w3-light-grey">
<p><i>"Make it
as simple as possible, but not simpler."</i></p>
<p>Albert
Einstein</p>
</div> »それを自分で試してみてください あなたがHTMLの<BLOCKQUOTE>を使用している場合、HTMLは余分な左マージンを追加することを覚えておいてください：
「可能な限りシンプルに、より簡単なありません。」
アルバート・アインシュタイン
例
<blockquote class="w3-container w3-leftbar w3-light-grey">
<p><i>"Make
it as simple as possible, but not simpler."</i></p>
<p>Albert Einstein</p>
</blockquote> »それを自分で試してみてください Hoverableボーダーズ
W3-ホバー・ボーダーカラークラスは、マウスオーバーで境界線の色を変更します。
レッドhoverableボーダー
ホバー上の青になり紫色のボーダー
例
<div class="w3-container w3-border w3-hover-border-red">
<p>Red
hoverable border</p>
</div> »それを自分で試してみてください