ポコ・ア・ポコ　パソコン教室

ポコ・ア・ポコ　パソコン教室は・・・ホームページを作ろう

ホームページを作るにはCSSを勉強しなければいけない。
解りやすく、CSSの具体例で説明します。

表示・非表示の実験

Idea Spice Agent
WHAT'S NEW
COMPANY INFORMATION
PRODUCT INFORMATION
RECRUIT
MAP

＜head＞
＜style type="text/css"＞
＜!--
.title9 {
visibility:hidden;
background-color:palegoldenrod;
border: 8px dashed olive;
width:500px;
color:crimson;
font-size:28px;
font-family:impact;
text-align:center;
}
.title10 {
visibility:visible;
float:left;
font-size:32px;
font-family:impact;
color:white;
border:1px solid white;
padding:8px;
width:100px;
}
--＞
＜/head＞

＜body＞
　　　　　　　＜span class="title9">Idea Spice Agent＜/span＞
＜span class="menu2"＞WHAT'S NEW＜/span＞
＜span class="menu2"＞COMPANY INFORMATION＜/span＞
＜span class="menu2"＞PRODUCT INFORMATION＜/span＞
＜span class="menu2" ＞RECRUIT＜/span＞
＜span class="menu2" ＞MAP＜/span＞
＜BR＞
＜IMG src="a021lin.gif" width="420" height="22" border="0" class="title2"＞
＜span class="title10"＞Idea Spice Agent＜/span＞
＜span class="menu2" ＞WHAT'S NEW＜/span＞
＜span class="menu2" ＞COMPANY INFORMATION＜/span＞
＜span class="menu2" ＞PRODUCT INFORMATION＜/span＞
＜span class="menu2"＞RECRUIT＜/span＞
＜span class="menu2" ＞MAP＜/span＞
＜/body＞

「表示する」か「表示しない」を、のいずれかで指定する。
visible（既定値：表示する）
hidden（表示しない）
inherit（継承）のいずれかで指定します。
JavaScript で表示のオン・オフを切り替えることができる。
例１
＜span style="visibility:hidden"＞おはよう＜/span＞

表示・非表示 の実験

表示・非表示の実験