5.1 タグの style 属性

HTML に関するその他の便利な機能もいくつかあります。Web が普及し始めると、Web ページを美しく、または非常に美しくデザインしたいという要求が高まりました。この問題は、 style使用することで解決されました。

この属性の一般的な形式は次のとおりです。


        <tag style="name=value;name2=value2;nameN=valueN">
    

styleセミコロンで区切られた属性値には、タグに適用する必要があるすべての「スタイル」がリストされます。

画像を正方形として表示し100*100、半分透明にしたいとします。これを行うには、特別なスタイルを追加する必要があります。

  • 幅=100ピクセル;
  • 高さ=100ピクセル;
  • 不透明度=0.5;

この画像を含む HTML コードは次のようになります。


       <img src="logo.png" style="width=100px;height=100px;opacity=0.5">
    

数千ではないにしても、数百のスタイルがあります。そしてブラウザ開発者は常に新しいものを開発しています。Web デザイナーではなく Java 開発者になることを勉強しているのは良いことです :)

5.2 一般的な CSS スタイル

人生で大量の HTML コードを作成したり、そのスタイルを編集したりすることはほとんどありませんが、何が起こる可能性があります。たとえば、 をテストするためにいくつかの小さな HTML ページを作成しているとしますAPI。したがって、基本的なスタイルを知っておくHTMLと役立ちます。

以下は、バックエンド開発者にとって最も一般的な 10 件です。

# 名前 説明
1 幅: 100px ピクセル単位の要素の幅
2 身長 高さ: 50% 要素の高さ (親の幅に対する) の割合
3 画面 表示: なし 表示要素 (非表示要素)
4 可視性 可視性: 非表示 要素の可視性 (要素は非表示ですが、そのためのスペースが予約されています)
5 赤色; テキストの色
6 背景色 背景色: 煙 背景色
7 国境 境界線: 1 ピクセルの黒一色。 ボーダー(幅1px、色黒、実線)
8 フォント フォント: ベルダナ 10pt フォント: verdana、サイズ 10pt
9 テキスト整列 テキスト整列: 中央; テキストを水平方向に配置する
10 マージン 余白:2px 要素の外側のパディング

すべてがインターネット上にあるため、これらのタグを覚える必要はありません。さらに、各「スタイル」には、有効な値の独自のセットと、値を記述するための独自の形式があります。少なくともborderまたはを見てくださいfont