【web独学】【webプログラミング】actのセクション 1:HTML + CSSの勉強①

webpro01

こんにちは。初めてのウェブの勉強に取り掛かります。

 

今回は最近半額キャンペーンをやっていました【act】
ウェブサービスを使用しての勉強です。

https://act.share-wis.com/courses/23?utm_content=afc_eQbLxxZvMqHkpADFILod

このサイトはこれからWEBプログラマーになりたいという人が初心者でもしっかりと基礎が学べると話題のサイトになります。

元々は海外の動画だったのですが、それの日本語版を作成してくれました。

一回払いきりのサービスで月額ではないので、一回払えばあとは安心してずっと使えます。

webプログラム03

スタートはここから


今回のレクチャー

今回学ぶのはこちら

  • XHTMLとCSSってそもそもなんだろう?
  • テキストエディターとブラウザーについて
  • ヘッダー、パラグラフ、ラインブレイクってどう使うの?

レクチャー1:XHTMLとCSSってそもそもなんだろう?

一番基本の部分です。

  • googleなどを例にコードの見方を学びます
  • HTML、XHTMLとは
  • CSSとは

レクチャー2:テキストエディターとブラウザーについて

エディタを使って初めてHTMLファイルを作成します。

エディタの紹介

windows:notepad++

mac:TextWrangler 

 

HTMLファイルの作成

簡単なHTMLファイルの作成

今回作成したWEBページのサンプル

レクチャー3:ヘッダー、パラグラフ、ラインブレイクってどう使うの?

<body>タグの中で使えるタグについての勉強

ヘッダー<h1>

ヘッダータグやボディタグで囲まれている部分を要素といいます。

ヘッダータグを<h1>〜<h6>までためしてみよう。

今回作成したWEBページのサンプル<h1></h1>

 

パラグラフ<p>

パラグラフを使って項目をわけて表示しよう。

今回作成したWEBページのサンプル

パラグラフはいくつも配置可能。

 

ラインブレイク<br />

改行をする時は<br><br />を使う。<br />のスペースはこれからの規格では必須。

今回作成したWEBページのサンプル

 

ホライズン<hr />

平行線を書く場合に使うタグを使ってみましょう。

今回作成したWEBページのサンプル

セクション分けでよく使うタグです。

今回のレクチャーの感想

まずは用語の説明から簡単なタグの設置までを行いました。

すこしWEBサイトを作ったこともあるのでここまではなんとかついていけています。

これからWEBプログラミングまでやることになるのか・・・

PHPとかmysqlなどが入ってくるとすこし心配。

 

では、また次回。

webpro01

よかったらシェアお願いします!

ABOUTこの記事をかいた人

2016年もよろしくお願いします!一段と美味しいものを求めて、いろいろなお店によらせて頂きたいと思います。
たくさん美味しいものを食べるために、体のこともしらないと!!ということで、機能解剖学を勉強しトレーナーへ転身。
『ぐるめのほそ道』をよろしくお願いします。
詳しいプロフィール