(cache) ソース表示

HTMLのソース

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="robots" content="index,follow">
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
<title>ここにタイトルを入れます</title>
<meta name="description" content="ページの概要を80文字程度で書きます。" />
<meta name="keywords" content="キーワード１,キーワード２,キーワード３,各キーワードは半角カンマで区切ります。
キーワードを詰めすぎるとスパム判定される場合もあるので，主要なキーワード5個程度にとどめておいた方がよいでしょう。" />
<link rel="stylesheet" href="./004.css" type="text/css">
<script language='JavaScript' src='./004.js'></script><!--右上のロールオーバーのジャバスクリプト-->
</head>

<body>
<a name="001" id="001"></a>
<br />

<!--SSSSSSSSSSSSSSSSSSSSSSSSSSSS　ミリピュアー　SSSSSSSSSSSSSSSSSSSSSSSSSS-->

<div id="container">

<div id="header"></div><!--/header-->

<div id="contents">


<div id="side_left">

<div class="sitename">
<img src="images/sitename.jpg" alt="Miripure" border="0" />
</div>

<img src="images/cm1.jpg" alt="Miripureがエストロゲンのバランスをケア" />
<img src="images/cm2.gif" alt="Miripureがエストロゲンのバランスをケア" />
<!--背景を表示させるためにcm2.gifは透過しています。-->

</div><!--/side_left-->


<div id="side_right">

<div class="title">
美肌はエストロゲンが重要！
</div>

ストレスや加齢など，様々な要因によりエストロゲン（女性ホルモン）は乱れます。<br />
<font color="#FF0033"><strong>プエラリアミリフィカ根エキス</strong></font>を成分にもつミリピュアーが，その乱れをケアします。

<div class="title">
プエラリアミリフィカとは
</div>

大豆などに含まれるイソフラボンは，女性らしい身体をつくるエストロゲンと似た働きがありますが，プエラリアミリフィカの根茎に含まれる<font color="#FF0033"><strong>デオキシミロエステロールは，そのイソフラボンの10000倍の力</strong></font>があります。
<div id="waku1">
<img src="images/pueraria.jpg" alt="" />
天然で高品質の"プエラリアミリフィカ"だけに含有されている"デオキシミロエステール"が，乱れてしまったエストロゲンをケアします。
</div>


<br clear="all" />

<div class="title">
当社独自の抽出方法
</div>

デオミロール循環多段式加圧抽出法（アルカリイオン水で抽出）で従来の抽出法よりも数十倍の成分抽出に成功しました。
<div id="waku2">
<div align="center"><img src="images/tyusyutu.gif" alt="" /></div>
</div>

<div class="title">
ご購入はこちら
</div>

<div align="center"><img src="images/order.gif" /></div>


</div><!--/side_right-->

<div id="siteindex"><!--ここから下がジャバスクリプトによるロールオーバーの記述です。-->
<div class="link"><a href="#" onMouseOver="imgOn('img1')" onMouseOut="imgOff('img1')"><img NAME="img1" src="images/link01b.gif" alt="ミリピュアー" border="0" /></a></div>
<div class="link"><a href="#" onMouseOver="imgOn('img2')" onMouseOut="imgOff('img2')"><img NAME="img2" src="images/link02b.gif" alt="お客様の声" border="0" /></a></div>
<div class="link"><a href="#" onMouseOver="imgOn('img3')" onMouseOut="imgOff('img3')"><img NAME="img3" src="images/link03b.gif" alt="ミリピュアーストーリー" border="0" /></a></div>
</div><!--siteindex-->

<br clear="all" />



<div id="page_left">
****** <a href="index.htm#001">トップへ</a> ******
</div>
<div id="page_right">
****** <a href="index.htm#001">トップへ</a> ******
</div>

</div><!--/contents-->

<br clear="all" />

<div id="footer"></div><!--/footer-->

</div><!--/container-->

<br />
</body>
</html>

CSSのソース

body {
     margin:0;
	 padding:0;
　　 font-size:14px;
     color:#666666;
     background-color: #ffffff;
	 text-align:center;
	 line-height:130%;
}

a:link {
	 color: #6666CC;
}
a:visited {
	 color: #6666CC;
}
a:hover {
	 color: #FF0033;
}


#container {
     margin:10px auto;
	 width:906px;
	 text-align:left;
	 background:url("images/bg_book2.jpg");
}
	
#header {
     width:906px;
	 height:15px;
	 background:url("images/bg_book1.jpg") no-repeat top;
}

#contents{
     margin:0px 35px 0px 45px;
	 background:url(images/content_bg.gif) no-repeat bottom;
}

#side_left {
     float:left;
	 width:390px;
	 margin-right:25px;
	 padding-top:10px;
}

#side_right {
     float:left;
	 width:350px;
	 margin-left:10px;
}

#siteindex{
     float:right;
     width:30px;
}
	 

#footer {
	 background:url("images/bg_book3.jpg") no-repeat bottom;
	 width:906px;
	 height:15px;
}


/* ページの基本デザイン */

/******　side_leftのデザイン　******/

.sitename{
     border-top: #EFEFEF solid 3px;
	 border-bottom: #EFEFEF solid 1px;
	 padding:7px 0px 0px 20px;
}


/******　side_rightのデザイン　******/

.title{
     font-size:16px;
	 font-weight:bold;
	 border-left:#CC3333 10px solid;
	 border-bottom:#CC3333 1px solid;
	 padding-left:5px;
	 margin-top:10px;
	 margin-bottom:10px;
	 color:#CC3333;
}
	 
#waku1{
     margin:5px;
	 padding:8px;
	 border-top:#CCCCCC double 3px;
	 border-bottom:#CCCCCC double 3px;
	 background-color: #FFF0F0;
}

#waku1 img{
     float:left;
	 margin-right:5px;
}
	 
#waku2{
     margin-top:10px;
}


/******　siteindexのデザイン　******/

#page_left{
     float:left;
	 width:350px;
	 margin-top:15px;
	 margin-right:20px;
	 text-align:center;
	 color:#CC0099;
}

#page_right{
     float: right;
	 width:350px;
	 margin-top:15px;
	 margin-right:20px;
	 text-align:center;
	 color: #CC0099;
}

.link{
     margin:2px 0px 2px 0px;
	 height:88px;
}

JavaScriptのソース

if (document.images) {            
img1on = new Image();   // マウスが触れたときに表示される
img1on.src = "images/link01a.gif"; 
img2on = new Image();
img2on.src = "images/link02a.gif";  
img3on = new Image();
img3on.src = "images/link03a.gif";


img1off = new Image();          // マウスを離したときに表示される
img1off.src = "images/link01b.gif"; 
img2off = new Image();          
img2off.src = "images/link02b.gif";
img3off = new Image();
img3off.src = "images/link03b.gif";


}

function imgOn(imgName) {        if (document.images) {
document[imgName].src = eval(imgName + "on.src");
            }}
                        
function imgOff(imgName) {        if (document.images) {
document[imgName].src = eval(imgName + "off.src");
            }}