汗で稼ぐ榎本行宏の『えのちゃんねる日記(仮題)』〜webデザインの勉強と漫画と小説と麻雀とあとなんか。〜はてなブログ版バージョン1.17 yukihiroenomoto666’s diary

『えのちゃんねる日記(仮題)』はてなブログ版へようこそ!汗で稼ぐ榎本行宏(フェリカwebサイト制作科2014年8月18日開講の生徒)のwebデザインの勉強や漫画や小説や麻雀やあとなんかの話。(*ω*)

スポンサーリンク

はてなブログのアプリをダウンロードしたので書けるかてすと。

*はてなブログのアプリをダウンロードしたので書けるかてすと。

汗で稼ぐ榎本行宏(フェリカwebサイト制作科2014年8月18日開講の生徒)です。

iPhoneはてなブログのアプリをダウンロードしたので書けるかてすと。


今日の授業も難しかった。

だが祭り男くんは天才っぷりを発揮していた。

そんな祭り男くんは来年の僕の誕生日に昭和天皇実録をプレゼントしてくれるらしい。

こうなったら維新政党・新風に入党してヤルタポツダム体制を打破するしかない!(*ω*)

維新政党・新風 - 日本人なら、新風が支持する候補者を勝たせよ!



榎本行宏のツイッター

@yukihiroenomoto


↓えのちゃんねる日記のはてなブログ版。

汗で稼ぐ榎本行宏の『えのちゃんねる日記(仮題)』〜webデザインの勉強と漫画と小説と麻雀とあとなんか。〜はてなブログ版バージョン1.17 yukihiroenomoto666’s diary



↓えのちゃんねる日記のはてなダイアリー版。

汗で稼ぐ榎本行宏の『えのちゃんねる日記(仮題)』〜webデザインの勉強と漫画と小説と麻雀と、あとなんか。〜はてなダイアリー版バージョン1.17


↓授業で作ってるjimdoの僕のページ。

Home - comic-parkdias-ye-666 ページ!


↓以下は今日の授業でやったHTMLとCSS



>|html|


<!DOCTYPE html>

<html lang="ja">

<head>

<meta charset="utf-8">

<title>卵料理カフェ</title>

<link rel="stylesheet" href="css/style2.css">

</head>

<body>

<div id="container">

<div id="sub">

<h1><img src="img/logo.gif" alt="卵料理カフェ Cockeyolly"></h1>

<ul>

<li><a href="#">Home</a></li>

<li><a href="#">ニュース</a></li>

<li><a href="#">メニュー</a></li>

<li><a href="#" class="this">今月のおすすめ</a></li>

<li><a href="#">オリジナル雑貨</a></li>

<li><a href="#">マップ</a></li>

<li><a href="#">メール</a></li>

</ul>

</div><!-- /#sub -->

<div id="main">

<h2><img src="img/title.gif" width="231" height="49" alt="今月のおすすめ"></h2>

<h3>きのこのオムライス</h3>

<p><img src="img/photo01.jpg" width="185" height="129" alt="きのこのオムライス">ふんわりアツアツのオムライスを、きのこたっぷりのドミグラソースでどうぞ。オムレツには新鮮な特選地卵を使って、ほんのり甘く仕上げています。<span class="price">800円</span></p>

<h3>シーフードスパゲッティ<br>バルサミコ風味</h3>

<p><img src="img/photo02.jpg" width="184" height="130" alt="シーフードスパゲッティ バルサミコ風味">エビ・イカ・アサリの入ったシェフご自慢のスパゲッティです。<br>バルサミコ酢と生クリームで作ったさっぱりソースをお楽しみください。<span class="price">900円</span></p>


<p class="footer"><small>(c)2014  卵料理カフェ Cockeyolly</small></p>

</div><!-- /#main -->

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

</body>

</html>


@charset "utf-8";


/* reset */

html, body, div, h1, h2, h3, p, ul, li, img {

  margin: 0;

  padding: 0;

  line-height: 1.0;

}

ul {

  list-style: none;

}

a {

  text-decoration: none;

}

img {

  border: none;

  vertical-align: bottom;

}


/* body */

body {

  color: #333;

  font-size: 16px;

  font-family:

    "Hiragino Kaku Gothic ProN",

    Meiryo,

     sans-serif;

     background: url(../img/bg_img.gif) repeat-y;

}


/* layout */

#container {

  width: 680px;

  padding: 15px;

  overflow: hidden;

}

#sub {

  width: 130px;

  float: left;

}

#sub h1 {

  margin-bottom: 50px;

  margin-left: 15px;

}

#sub li a {

  display: block;

  color: #FFF;

  font-weight: bold;

}

#sub li a:hover, #sub li a.this {

  color: #FF6;

}

#sub li {

  line-height: 2.0;

}

#main {

  width: 460px;

  float: left;

  margin: 30px 0 0 50px;

}

#main h2 {

  text-align: center;

  margin-bottom: 50px;

}

#main h3 {

  color: #7C533F;

  line-height: 1.3;

  margin-bottom: 10px;

  padding-left: 0.5em;

  border-left: 8px solid #DA8125;

}

#main p {

  line-height: 1.6;

  margin-bottom: 30px;

}

#main p img {

  float: right;

  margin-left: 1.0em;

}

p.footer {

  text-align: center;

  border-top: 1px solid #AAA;

  padding-top: 5px;

}

span.price {

  color: #F30;

  font-weight: bold;

}


||<