読者です 読者をやめる 読者になる 読者になる

プログラミング教育のMOZER | Webデザイン学習コース体験版

Game

デイジーと秘密のメッセージ

mozer.io


f:id:web-0818:20161018014633j:plain

f:id:web-0818:20161018015314j:plain

f:id:web-0818:20161018031333j:plain

Webサイトの構造を理解しよう

HTML+CSS

Markup STEP1

f:id:web-lesson:20161016004350p:plain

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
</head>
<!--STEP1 START-->
<body>
</body>
</html>
01. ボックスモデルを理解しよう

f:id:web-lesson:20161016005538p:plain

f:id:web-lesson:20161016005802p:plain

02. レイアウトの考え方

f:id:web-lesson:20161016011053p:plain

f:id:web-lesson:20161016013324p:plain

f:id:web-lesson:20161016013627p:plain

03. コーディングの書き方

f:id:web-lesson:20161016014329p:plain

f:id:web-lesson:20161016015258p:plain

04. コメントアウトを使おう

f:id:web-lesson:20161016020106p:plain

05. 実際に作ってみよう

f:id:web-lesson:20161016020816p:plain


コーディング

  • サンプルと同じid名・class名にする必要はありません(若干偏りがあります)
  • clearの使い方も間違っています(そこは、無視して進めましょう)

f:id:web-lesson:20161016155257p:plain

提出

  • 完成形のアップロードは、Markupの課題のままではなく、「テキスト・画像」ともにカスタマイズ後提出すること
  • STEP1からSTEP4までを提出すること


f:id:web-lesson:20161016171152p:plain

マルチカラム - ワインとパスタのお店

HTML+CSS

マルチカラム - ワインとパスタのお店

atella

    concept
    pasta
    drink
    side
    access

    Lunch
    Pasta
    Wine

現在実施中のキャンペーンやお得な情報
Today's Pasta 今日の日替わりパスタ

ペンネアラビアータ
(ピリ辛トマトソースのペンネ)
news

2016.5.24
    今年も冷製パスタをお出しし始めました
2016.5.18
    トマトソースの作成ビデオを公開しました

CouponTickets ランチセットご注文時ドリンク1杯無料

©2016 atella.


f:id:web-lesson:20161010200050p:plain