news,Webサイト制作,ホームページ中級講座,ホームページ基礎講座

Thumbnail of post image 073

Visual Studio Codeとは、Microsoft Azureが開発している様々なOS(Windows/Mac)上で動くコードエディターです。そもそもエディターという ...

Webサイト制作,ホームページ中級講座,動画

Thumbnail of post image 029

ホームページ内で表組みを作成する場合はtable要素を使います。 ひと昔前までは、テーブルレイアウトというのを使ってレイアウトを作成している時代がありましたが、今のTable要 ...

Webサイト制作,ホームページ中級講座,ホームページ基礎講座,動画

Thumbnail of post image 043

模写コーディングを行う際は、少しでも速く、効率良く入力を練習する必要があります。 何度か紹介してきたプラグイン「Emmet!」を再度解説した動画です。確認してみましょう。 Em ...

Webサイト制作,ホームページ中級講座,動画

Thumbnail of post image 087

今回はよく使うフォトギャラリーを作っていきましょう〜写真とキャプションの組み合わせのカード形のデザインです。<figure>という要素を使います <figure>? ...

Webサイト制作,ホームページ中級講座,動画

Thumbnail of post image 192

前回の18ホームページ中級講座 flat を使った回り込みの続きになります。 今回は、ページ一番下に常に配置するfooter要素を、一番最下部に固定する状態を作ります。 最近の ...

Webサイト制作,ホームページ中級講座,動画

Thumbnail of post image 142

前回「17 ホームページ中級講座」の続きとなります。 HTMLとCSSは前回のファイルを引き続き使いますので用意しておきましょう。 ここでは、cssの周り込みのプロパティ「fl ...

Webサイト制作,ホームページ中級講座,動画

Thumbnail of post image 182

前回の06 ホームページ中級講座 便利なEmmet!で作成したHTMLのマークアップファイルを使います。 ここから学習する場合は、フォルダは07を作成して、下記のHTMLファイ ...

Webサイト制作,ホームページ中級講座,動画

Thumbnail of post image 074

16ホームページ中級以降は、少し懐かしさもある下記のようなホームページのコードを模写しながら練習していきましょう。 パソコン画像とグラフ画像ファイルは別途準備ください。 テキス ...

Webサイト制作,ホームページ中級講座,動画

Thumbnail of post image 032

前回の04ホームページ中級講座 display:flex のおさらいの続きになります。 05のフォルダを作成し、inde.htmlに下記コードを貼り付けます。style.css ...

Webサイト制作,ホームページ中級講座

Thumbnail of post image 153

下記の講座で、ナビゲーションについてのコード練習を行ってきました。 01 ホームページ中級講座 ナビゲーションの作成(HTML)02ホームページ中級講座 ナビゲーションの作成( ...

Webサイト制作,ホームページ中級講座,動画

Thumbnail of post image 169

前回はホームページのヘッダー内に設置する「グローバルナビゲーション」のCSS設定「02ホームページ中級講座 ナビゲーションの作成(CSS)」を行なってきました。 前回の続きで、 ...

Webサイト制作,ホームページ中級講座,動画

Thumbnail of post image 187

前回01 ホームページ中級講座 ナビゲーションの作成(HTML)作成したHTMLファイルにCSSを記述しデザインを適応させていききます。 HTMLマークアップファイル マークア ...

Webサイト制作,ホームページ中級講座,動画

Thumbnail of post image 167

ホームページ中級講座1回目では、下記の完成形をめざしてHTML/CSSを1回目と2回目で記述していきます。 ホームページ初級講座で使っていたフォルダは閉じて、新たにホームページ ...