2-1 | 不動産業者が自力でホームページを作る方法!

不動産業者が自力でホームページを作る方法!

ホームページを自力で作成して、ホームページから収入を得るまでを公開!!
ホームページ制作の過程、素人からホームページ制作で仕事を取るまで

<!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 http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>SAMPLE</title>
<style type="text/css">

a {color: #017acd}

/* コンテナ */
div#container {width: 760px;
margin-left: auto;
margin-right: auto}

/* ヘッダー */
div#header {background-color: #017acd;
background-image: url(sky.jpg);
padding: 28px 20px 150px}

div#header h1 {margin: 0}

div#header p {color: #ffffff;
font-size: 0.75em;
margin: 0}

/* パンくずリスト */
p#bread {font-size: 0.75em;
margin-top: 3px;
margin-bottom: 30px}


/* コンテンツ */
div#content {width: 564px;
float: right;
margin-left: auto;
margin-right: auto;
margin-bottom: 25px}

div#content h2 {background-color: #014471;
background-image: url(bar-blue.png);
background-repeat: no-repeat;
font-size: 0.875em;
color: #ffffff;
line-height: 28px;
padding-left: 6px;
margin-top: 0;
margin-bottom: 0}

div#content h3 {background-color: #e0e0e0;
background-image: url(bar-green.png);
background-repeat: no-repeat;
font-size: 0.875em;
line-height: 23px;
padding-left: 30px;
margin-top: 30px;
margin-bottom: 0}

div#content p {font-size: 0.75em;
line-height: 1.6;
margin-top: 10px}


/* サイドバー */
div#sidebar {width: 166px;
float: left;
margin-bottom: 25px}

ul.sidemenu {font-size: 0.75em;
margin-top: 0;
margin-left: 0;
padding-left: 0;
line-height: 0}

ul.sidemenu li {list-style-type: none}

ul.sidemenu li a {display: block;
line-height: 30px;
text-decoration: none;
color: #ffffff;
background-color: #005087;
border-bottom: solid 1px #ffffff;
padding-left: 10px}

ul.sidemenu li a:hover {background-color: #017acd}

p.feed {margin-bottom: 10px}

p.feed a {font-size: 0.75em;
color: #444444;
text-decoration: none;
line-height: 30px;
border: solid 1px #888888;
padding: 5px}

p.feed img {border: none;
vertical-align: middle}


/* フッター */
div#footer {background-image: url(line-blue.png);
background-repeat: repeat-x;
width: 760px;
margin-top: 0;
padding-top: 8px;
clear: both}

address {font-size: 0.75em;
font-style: normal;
text-align: center}

</style>
</head>
<body>

<!-- コンテナ -->
<div id="container">

<!-- ヘッダー -->
<div id="header">
<h1><img src="logo.gif" alt="Green Leaf" /></h1>
<p>生活を楽しくする情報をもっと身近にお届けします</p>
</div>

<!-- パンくずリスト -->
<p id="bread">
<a href="link.html">トップページ</a> &gt;
<a href="link.html">サービス案内</a>
</p>


<!-- コンテンツ -->
<div id="content">

<h2>サービス案内</h2>

<p>Green Leafは生活を楽しくするサービスを、もっと身近にお届けするために活動している企業グループです。情報サイトやショッピングサイトを通じてさまざまなサービスの提供を行い、みなさまをサポートいたします。</p>

<h3>情報サイト「Green Leaf」</h3>

<p>情報サイト「Green Leaf」では、「生活を楽しくするサービスをもっと身近に」をテーマに、日常生活で役に立つサービスの情報をお届けします。生活を楽しくするためには、「衣」「食」「住」を満たすことが大切です。そのために必要な情報を充実させました。最新のファッション事情から洋服のリサイクル情報、安全でおいしい食材にレシピ、それを味わえるレストラン、住まいを快適にアレンジするテクニック、職人に支えられた伝統の技などなど… 楽しみながら活用していただければと思います。</p>

<p>また、「遊」を充実させる情報として、関東、関西圏を中心としたレジャーや癒しのスポットを紹介します。名所・旧跡に温泉、日帰り旅行からちょっとした贅沢な旅まで取り揃えていく予定です。</p>


<h3>ショッピングサイト「Green Shop」</h3>

<p>ショッピングサイト「Green Shop」では、情報サイト「Green Leaf」で紹介した "いいもの" や "おもしろいもの" を購入していただけるようにしています。</p>

<p>そのほかにも、ショップ内のToy Boxコーナーではヨーロッパやアフリカの遊び心にあふれる玩具を、Candy Boxコーナーではカラフルでおいしいお菓子をたくさん扱っています。また、地域ごとの地場産野菜の宅配も承っておりますので、ぜひご利用ください。</p>

</div>


<!-- サイドバー -->
<div id="sidebar">

<ul class="sidemenu">
<li><a href="link.html">トップページ</a></li>
<li><a href="link.html">会社情報</a></li>
<li><a href="link.html">サービス案内</a></li>
<li><a href="link.html">お問い合わせ</a></li>
<li><a href="link.html">ブログ</a></li>
</ul>

<p class="feed">
<a href="feed.xml">
<img src="feed-icon-14x14.png" alt="RSS" />
RSSフィード
</a>
</p>

</div>


<!-- フッター -->
<div id="footer">
<address>Copyright (C) Green Leaf, All rights reserved.</address>
</div>

</div>

</body>
</html>