HTMLタグの背景と境界線を作成します
この記事では、HTMLタグの背景を作成する方法を紹介します。これにより、背景に関するいくつかのCSSプロパティの使用方法を知ることができます。
HTMLタグの背景色を作成するには、backgroundプロパティを使用します。この記事はCSS学習シリーズで紹介しましたが、皆さんの便宜のために、今日はまったく新しいレッスンを作成します。詳細については、上記のリンク先の記事をご覧ください。
1.HTMLタグの背景色を作成します
divタグがあり、その背景と境界線を作成したい場合は、 backgroundプロパティとborderプロパティを使用します。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <style type="text/css"> div{ background: red; height: 200px; } </style> </head> <body> <div> Nội dung bên trong </div> </body> </html>それに境界線を追加します。
div{ background: red; height: 200px; border: solid 3px blue; }ご覧のとおり、このdivタグの背景の長さは100％です。これは、divタグがブロックとして表示されるため、幅が100％であるためです。ここでスパンタグに置き換えると、まったく異なります。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <style type="text/css"> span{ background: red; border: solid 3px blue; } </style> </head> <body> <span>Thẻ span</span> </body> </html>2.背景色と境界線の色を理解する
色に関しては、以下のルールに従って使用できます。
- 黒、白、赤、青などの英語の名前を使用してください…
- 次のようなRGB形式を使用します。
- rgb（255,0,0）=赤
- rgb（0,255,0）=緑
- rgb（0,0,255）=青
- rgb（0,0,0）=黒
- rgb（255,255,255）=白
- 次のような16進形式を使用します。
- ＃ff0000=赤
- ＃00ff00=緑
- ＃0000ff=青
- ＃000000=黒
- #ffffff=白
- そしてRGBAやHSLのような他のいくつかのフォーマット
これはPhotoshopの標準カラーコードであるため、通常は16進形式を使用します。
例：背景を赤に設定します。次のいずれかの方法で記述できます。
background: red; background: #ff0000; background: rgb(255,0,0); Bài viết liên quan:
Dịch vụ thiết kế Wesbite
