色と背景の設定

1.文字の色(前景色)

指定方法 { color : (色) ; }


 色の指定方法は、色名による指定、RGB指定(#rrggbb または #rgb)のどちらでもよい。

h4  { color : red ; }  
p   { color : #cc00ff ; }


 ・・・ 略 ・・・


<h4>CSSの基礎知識</h4>
<p>スタイルシートは、ウェブページのデザインを定義、記述するための・・・</p>

CSSの基礎知識

スタイルシートは、ウェブページのデザインを定義、記述するための・・・




2.背景色の設定

指定方法 { background-color : (色) ; }


h4  { background-color : lightgreen ; }  
.amikake   { background-color : #ccf ; }


 ・・・ 略 ・・・


<h4>CSSの基礎知識</h4>
<p>スタイルシートは、<span class="amikake">ウェブページのデザイン</span>を定義、記述するための・・・。<br>
HTML文書の<span class="amikake">効率的なウェブ管理</span>ができ・・・</p>

CSSの基礎知識

スタイルシートは、ウェブページのデザインを定義、記述するための・・・。
HTML文書の効率的なウェブ管理ができ・・・



3.背景画像の設定

指定方法 { background-image : url(画像ファイル名); }


body  { background-image : url(sakura.gif) ; }  


 ・・・ 略 ・・・


<h4>CSSの基礎知識</h4>
<p>スタイルシートは、ウェブページのデザインを定義、記述するための・・・</p>

CSSの基礎知識

スタイルシートは、ウェブページのデザインを定義、記述するための・・・







背景画像の表示方法を指定することができる{ background-repeat:(キーワード);}
  (キーワード)
   repeat-x  : 画像を横方向だけに繰り返して、敷き詰める
   repeat-y  : 画像を縦方向だけに繰り返して、敷き詰める
   no-repeat : 画像を繰り返さずに、1つだけ表示する
body  { background-image : url(sakura.gif) ; background-repeat : repeat-y ; }  

 
 ・・・ 略 ・・・


<h4>CSSの基礎知識</h4>
<p>・・・背景画像を縦方向だけにリピートします・・・</p>

CSSの基礎知識

・・・背景画像を縦方向だけにリピートします・・・