CSS練習「emとvisibility: hidden」

Web応用

全体のブロックレイアウトとメニューの作成

http://homepage2.nifty.com/melcafe/dental/dental.html

ソースが

<ul>

<li id="menu01"><a href="#"><em>歯科求人検索</em></a></li>

<li id="menu02"><a href="#"><em>掲載のお申込</em></a></li>

<li id="menu03"><a href="#"><em>掲載までの流れ</em></a></li>

<li id="menu04"><a href="#"><em>料金</em></a></li>

<li id="menu05"><a href="#"><em>サイト概要</em></a></li>

</ul>

 

そしてCSSのほうで

#header #menu li em{

visibility: hidden;

}

#header #menu li {

float: left;

height: 40px;

margin: 0px;

padding: 0px;

}

#header #menu #menu（01〜05） a{

display:block;

background-image: url(各画像指定);

background-repeat: no-repeat;

height: 40px;

width: 150px;

empty-cells:hide;

float: left;

text-decoration: none;

}