§05-08…囲み線基本{border}
(01) <h2>を、太さ2pxの実線で囲みます。この囲み線を指定する際には、太さを指定する「border-width」プロパティと、線の種類を指定する「border-style」プロパティの指定が必要です。太さの値は「2px」、実線を表す値は「solid」となります。CSSファイルの<h2>要素の部分を以下のように更新してください。...
§05-07…フォント{font-family}
(01) 通常IEでは、表示フォントに「MSPゴシック」が採用されています。これをヒゲ(セリフ)・払いの付いた書体に変更しましょう。フォントの種類は「font-familiy」プロパティを使います。セリフ付き書体を採用するには、値を「serif」にします(インストールされているセリフ系フォントの中から適切なものが自動選択される)。CSSファイルの<h1...
§05-06…行の高さ{line-height}
<p>タグ内の行の高さをフォントサイズの2倍にします。行の高さは「line-height」プロパティで設定します。CSSファイルの<p>要素の部分を以下のように更新してください。更新後はWebページをブラウジングします。 p{ text-indent:1em; line-height:2.0; }
§05-05…字下げ{text-indent}
<p>タグ内のテキストを1字分字下げします。字下げ幅を決めるのは「text-indent」プロパティです。CSSファイルに以下のような<p>要素の書式情報を追加してください。更新後はWebページをブラウジングします。 p{ text-indent:1em; }
§05-04…スモールキャピタル{font-variant}
英単語の小文字の部分を小さな大文字(スモールキャピタル表示)にするには 「font-variant」プロパティの値を「small-caps」にします。<h1>タグ内の英単語をスモールキャピタル表示にします。CSSファイルの<h1>要素の部分を以下のように更新してください。更新後はWebページをブラウジングします。 h1{ bac...
§05-03…斜体{font-style}
<h2>内のテキストを斜体にします。斜体にするには「font-style」プロパティの値を「italic」にします。CSSファイルの<h2>要素の部分を以下のように更新してください。更新後はWebページをブラウジングします。 h2{ color:#FF3333; font-weight:normal; font-style:i...
§05-02…<body>の{margin}
(01) IEの標準状態では、body内部とウィンドウの間に若干の空間があります。 (02) この隙間を無くして各段落の背景色をぴったりウィンドウにつけるには、事前にbodyのmarginを「0」にする必要があります。なお、「0」の場合は「0em」のように単位を付けなくても「0」で適用されます。CSSファイルの<body>要素の部分...
§05-01…CSSの基礎3・準備
(01) 次のようなソースのWebページ「re04.htm」を作成してください。 <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" ""> <html xmlns="" x...
§04-06…文字の間隔{letter-spacing}
(01) <h2>内の文字の間隔を広げます。文字の間隔を変更するには「letter-spacing」プロパティを用います。0.5文字分空けたいので、CSSファイルの{h2}部を以下のように更新してください。更新後はWebページをブラウジングします。 h2{ background-color:#00FF00; letter-spacing:0...