ばらの垣根・タグ【Template】

10.ばらの垣根
フレームなし。使用画像9点。

◆Topページ用　【sample】

HTMLタグのソース（エリア内をクリックすると全て選択します）

　
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>ばらと垣根【Top用】</title>

<style tipe=text/css>
<!--
body {scrollbar-arrow-color: #ffffff;
      scrollbar-face-color: #ffffff;
      scrollbar-highlight-color: #921e4c; 
      scrollbar-3dlight-color: #ffffff; 
      scrollbar-track-color: #ffffff;
      scrollbar-shadow-color: #921e4c; 
      scrollbar-darkshadow-color: #ffffff;}
-->

<!--
body,td {color:#585858;
         font-family: 'Verdana,San serif';} 
-->

<!--
body{cursor: crosshair;}
 -->
        
<!--
a{text-decoration: none;
  cursor: crosshair;}
a:link{color: #d53373;}
a:visited{color: #7ab751;}
a:active{color: #b1d599;}
a:hover{text-decoration: none;
        color:#ea99b9;
        position: relative; top: 1pt; left: 1pt;}
-->

<!--
.t{border: none;}
.t1{border: 1pt dotted #921e4c;}
.t2{border-top: 1pt dotted #921e4c;
    border-bottom: 1pt dotted #921e4c;}
-->
</style>

</head>

<body>

<table class="t" width="100%" height="100%" align="center" valign="middle" cellpadding="0">
<tr>
<td class="t" width="100%" height="100%" align="center" valign="middle">

<table class="t" width="700" height="400" cellspacing="2"> 
<tr> 
<td class="t1" width="14%" align="center" valign="middle" onmouseover="this.style.backgroundColor='#921e4c'" onmouseout="this.style.backgroundColor='#ffffff'">
<a href="ここにリンク先ファイル名.htm" title="自己紹介">    <font size="2">Profile</font>    </a>     
</td>
<td class="t1" width="15%" align="center" valign="middle" onmouseover="this.style.backgroundColor='#921e4c'" onmouseout="this.style.backgroundColor='#ffffff'">
<a href="ここにリンク先ファイル名" title="更新履歴"> <font size="2">What's new</font> </a>     
</td>
<td class="t1" width="15%" align="center" valign="middle" onmouseover="this.style.backgroundColor='#921e4c'" onmouseout="this.style.backgroundColor='#ffffff'">
<a href="ここにリンク先ファイル名" title="メインコンテンツ">     <font size="2">Main</font>     </a>     
</td>
<td class="t1" width="14%" align="center" valign="middle" onmouseover="this.style.backgroundColor='#921e4c'" onmouseout="this.style.backgroundColor='#ffffff'">
<a href="ここにリンク先ファイル名" title="掲示板" target="_blank">      <font size="2">BBS</font>      </a>     
</td>
<td class="t1" width="14%" align="center" valign="middle" onmouseover="this.style.backgroundColor='#921e4c'" onmouseout="this.style.backgroundColor='#ffffff'">
<a href="ここにリンク先ファイル名" title="ブログ" target="_blank">     <font size="2">Diary</font>     </a>     
</td>
<td class="t1" width="14%" align="center" valign="middle" onmouseover="this.style.backgroundColor='#921e4c'" onmouseout="this.style.backgroundColor='#ffffff'">
<a href="mailto:ここにメールアドレス" title="お便り">     <font size="2">mail</font>     </a>         
</td>
<td class="t1" width="14%" align="center" valign="middle" onmouseover="this.style.backgroundColor='#921e4c'" onmouseout="this.style.backgroundColor='#ffffff'">
<a href="ここにリンク先ファイル名" title="リンクについて">     <font size="2">Link</font>     </a>     
</td>
</tr>

<tr> 
<td class="t" align="center" valign="middle" colspan="7" bgcolor="#ffffff">
<br>
<font size="6" face="恋文ペン字">HP TITLE</font>
<br>

<table cellpadding="0" cellspacing="0" border="0">      
<tr>      
<td background="ta-kiwaku-a.jpg" width="50" height="50">      
</td>      
<td background="ta-kiwaku-o.jpg" width="400" height="50">      
</td>      
<td background="ta-kiwaku-b.jpg" width="50" height="50">      
</td>      
</tr>      
<tr>      
<td background="ta-kiwaku-l.jpg" width="50" height="250">      
</td>      
<td width="400" height="50" style="background-image: url('c-stencil-huu-rose.jpg'); background-repeat: no-repeat; background-position: 100% 50%">      
<p style="line-height: 150%">
<font size="1">      
ここに文字。
</font>
</p>      
</td>      
<td background="ta-kiwaku-r.jpg" width="50" height="250">      
</td>      
</tr>      
<tr>      
<td background="ta-kiwaku-d.jpg" width="50" height="50">      
</td>      
<td background="ta-kiwaku-u.jpg" width="400" height="50">      
</td>      
<td background="ta-kiwaku-c.jpg" width="50" height="50">      
</td>      
</tr>      
</table>      

</td>
</tr>
</table>

<br>

<table class="t" width="700" height="20" cellspacing="0"> 
<tr> 
<td class="t2" align="center" valign="middle" bgcolor="#ffffff"> 
<font size="1">Copyright (C) サイト名または管理人名  All rights reserved.</font>                                              
</td>                                       
</tr>                                       
<tr>                                       
<td class="t" align="right" valign="middle">                                        
<font size="1"><a href="http://crambon.himegimi.jp/" target="_blank" title="フリー素材＆テンプレート配布屋">Designed by Crambon*</a></font>                                       
</td>                                       
</tr>                                        
</table>                                        
                      
</td>                                       
</tr>                                        
</table>          
                           
</body>             
</html>

◆Mainページ用　【sample】

HTMLタグのソース（エリア内をクリックすると全て選択します）

　
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>ばらと垣根【Main用】</title>

<style tipe=text/css>
<!--
body {scrollbar-arrow-color: #ffffff;
      scrollbar-face-color: #ffffff;
      scrollbar-highlight-color: #921e4c; 
      scrollbar-3dlight-color: #ffffff; 
      scrollbar-track-color: #ffffff;
      scrollbar-shadow-color: #921e4c; 
      scrollbar-darkshadow-color: #ffffff;}
-->

<!--
body,td {color:#585858;
         font-family: 'Verdana,San serif';} 
-->

<!--
body{cursor: crosshair;}
 -->
        
<!--
a{text-decoration: none;
  cursor: crosshair;}
a:link{color: #d53373;}
a:visited{color: #7ab751;}
a:active{color: #b1d599;}
a:hover{text-decoration: none;
        color:#ea99b9;
        position: relative; top: 1pt; left: 1pt;}
-->

<!--
.t{border: none;}
.t1{border: 1pt dotted #921e4c;}
.t2{border-top: 1pt dotted #921e4c;
    border-bottom: 1pt dotted #921e4c;}
-->
</style>

</head>

<body>

<table class="t" width="100%" height="100%" align="center" valign="middle" cellpadding="0">
<tr>
<td class="t" width="100%" height="100%" align="center" valign="middle">

<table class="t" width="800" height="400" cellspacing="0" bgcolor="#ffffff"> 
<tr> 
<td class="t2" height="30" align="center" valign="middle">
<font size="3">ここにページのタイトル</font>    
</td>
</tr>
<tr> 
<td class="t" width="800" align="left" valign="top" style="background-image: url('c-stencil-huu-rose.jpg'); background-repeat: no-repeat; background-position: 50% 20%">
<br>
<p align="left" style="line-height: 150%; margin-left: 50; margin-right: 50"> 
<font size="2">
ここに文章。
</font>
</p>
<br>
<p align="right">
<a href="t-stencil-huu1-1.htm" title="index"><font size="1">Homeへ</font></a>     
</p>
</td>        
</tr>   
</table>        

<br>

<table class="t" width="800" height="20" cellspacing="2" bgcolor="#ffffff"> 
<tr> 
<td class="t2" align="center" valign="middle" bgcolor="#ffffff"> 
<font size="1">Copyright (C) サイト名または管理人名  All rights reserved.</font>                                                          
</td>                                                   
</tr>                                                   
<tr>                                                   
<td class="t" align="right" valign="middle" bgcolor="#ffffff">                                                    
<font size="1"><a href="http://crambon.himegimi.jp/" target="_blank" title="フリー素材＆テンプレート配布屋">Designed by Crambon*</a></font>                                                   
</td>                                                   
</tr>                                                    
</table>                                                    
                                                   
</td>                                                    
</tr>                                                    
</table>                                                           
                                                           
</body>                                                           
</html>

◆使用画像（Topはバラと木枠(テーブル)・Mainはバラのみ。画像は縮小表示しています。このままDLしてください。）

♪木枠テーブルの一括DLはここをクリック♪

バラよりもチューリップがいい方はこちらへ

テーブルを構成している画像、いっぱいあって、どれをどこに入れるのかわかんなくなりそうだったので、
当サイトで使っているファイル名を、タグの中にそのまま入れてあります。画像保存する時、ファイル名を変えないのであれば、
ご自分で編集される時に画像ファイル名を改めて打ち込む必要はありません。
木枠テーブル画像は圧縮フォルダに入った状態ですので、DL後、展開先フォルダを他のファイルと同じフォルダに指定して展開するようにしてください。

素材を探すなら・・・ ◆sozai-R ◆素材NAVI ◆素材屋ランキング ◆0574 w.s.r

Crambon* Template
●規約に同意できる方はソースと使用画像をコピーしてお使いのPCに保存し、ご利用ください。素材の規約ページへテンプレートの規約ページへ（画像は右クリックして「名前をつけて画像を保存」。ソースはコピーしてメモ帳などに貼り付けHTMLファイルとして保存（拡張子をhtmかhtmlに）してください。） ●「ここに画像のファイル名」と書いてあるところにはご自分で指定した画像のファイル名を入れてください。「ここにメールアドレス」なども同様です。