ホームページ > ウェブフロントエンド > htmlチュートリアル > HTMLセット横分割線_html/css_WEB-ITnose

HTMLセット横分割線_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
リリース: 2016-06-21 09:05:24
オリジナル
4347 人が閲覧しました

Web 上で水平分割線を使用すると、さまざまなテキスト段落やその他の Web ページ コンポーネントを分離し、段落レイアウトを簡単に変更してより美しくすることができます。もちろん、水平分割線を使用すると、テキストの重要な段落をより明確に強調表示し、より目を引くようにすることもできます。


タグを使用して水平線を簡単に設定します。方法は以下の通りです:

HTMLで水平分割線を設定します

1. HTMLで水平分割線を設定します

これは水平分割線の最も基本的な応用です。中央揃えになっています。

2. HTML は水平分割線の幅を設定します

<hr />
ログイン後にコピー

水平分割線の幅は、画面幅に対するピクセル (px) またはパーセント (%) です。例:

<hr width="200" />
ログイン後にコピー

3. HTML は水平分割線の太さを設定します

<hr width="200px" /> <!--单位为像素。默认值是将px去掉,成为上面的格式--><hr width="20%" />   <!--单位是相对于屏幕宽度的百分比-->
ログイン後にコピー

水平分割線の太さの単位は依然としてピクセル (px) です。

4. HTML の水平分割線の影を削除する

<hr size="30" />
ログイン後にコピー

一般的に、水平分割線は影付き、具体的には凸線または凹線として表示されます。このプロパティを使用すると、分割線の影を削除し、影のない実線にすることができます。

5. HTML は水平分割線の配置を設定します

<hr noshade="noshade" />
ログイン後にコピー

水平分割線の配置はデフォルトで中央揃えになります。その配置は、align 属性を使用して変更できます。また、その幅が画面の幅よりも小さく設定されている場合にのみ、位置合わせ設定の効果が表示されます。

6. HTML は水平分割線の色を設定します

<hr width="30%" align="left" />
ログイン後にコピー

水平分割線にはさまざまな色を設定できます。

7. HTML は水平分割線の title 属性を設定します

<hr color="#FF0000" />
ログイン後にコピー

ビューアが分割線の上にマウスを置くと、属性値を設定するためのプロンプトが表示されます。

8. HTML 水平分割線の包括的な適用

<hr size="30" title="设置水平分割线的title属性" />
ログイン後にコピー

サイズ、幅、配置、色、陰影などの
の属性を個別に設定できます。すべてのプロパティを設定する必要はありませんが、必要に応じていくつかのプロパティを選択して、設定されていないプロパティがデフォルトの方法で表示されます。

  • デフォルトの方法: ブラウザーが不完全な属性を持つタグを検出すると、ブラウザー内で定義されたスタイルに従って、未設定の属性が表示されます。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート