Webサイト制作

04 はじめてのホームページ HTMLとCSS

HTMLのマークアップされたファイルにCSSを書いていきます HTMLファイルを開いたら、<title>エコロジー&環境問題<title>の直下に内包のスタイルシートを書いていきます。<styl...
Webサイト制作

03 はじめてのホームページ HTMLとCSS

基本のマークアップが終わりましたら、今回はHTMLで画像の設定を行います。画像は<img>要素を使います。 画像はインライン要素ですので、今回の動画は<p>要素の中に書いています <p><img sr...
Webサイト制作

02 はじめてのホームページ HTMLとCSS

01のはじめてのホームページ HTMLとCSSでは、エディタに文字にマークアップ言語であるHTMLを設定しました。タイトルにはタイトル要素の<h1>を文章には、段落要素の<p>をマークアップしています。今回は、デザイン担当のCSSを設定します。
Webサイト制作

01 はじめてのホームページ HTMLとCSS

マークアップ言語であるHTMLは、文章に印をつけていく構造型 骨組みの言語です。タイトルだったら<h1> そのサブタイトルだったら<h2> 段落だったら<p> 箇条書きだったら<ul><li>  リンクだったら <a href=""> というように印をつけていく言語です。
illustrator講座

03 バナー作成講座 背景に写真・さくら吹雪のブラシ

在宅・フリーランスになるためのバナー作成講座 yoshiko先生 Webサイト制作で必要な要素のひとつ「バナー」今回は、Photoshop バナーで、背景に写真やイラストを設置してみます。 はてな? バナー作成講座の2回目で...
Webサイト制作

01 レスポンシブホームページ基本講座

レスポンシブとは、スマートフォン・タブレット・パソコン画面をHTMLはひとつで、CSSで見た目を可変するデザインのことです。今回のレスポンシブホームページ基礎講座は、その概念と考え方を行います。そこで、まず最初に使い方を覚えておく必要がある、google クロムの検証ツール「chromeデベロッパーツール」の使い方を行います。レスポンシブ講座では必須なので、ここでしっかりと使いかたを覚えていきます。
Webサイト制作

00 レスポンシブホームページ基本講座

レスポンシブとは、スマートフォン・タブレット・パソコン画面をHTMLはひとつで、CSSで見た目を可変するデザインのことです。今回のレスポンシブホームページ基礎講座は、その概念と考え方を行います。そこで、まず最初に使い方を覚えておく必要がある、google クロムの検証ツール「chromeデベロッパーツール」の使い方を行います。レスポンシブ講座では必須なので、ここでしっかりと使いかたを覚えていきます。
illustrator講座

02 バナー作成講座 コピー文をバナーらしく載せる

在宅・フリーランスになるためのバナー作成講座 yoshiko先生 Webサイト制作で必要な要素のひとつ「バナー」今回は、Photoshop にコピー文を広告バナーらしく入力していきます。 はてな? バナーらしくとは??どん...
illustrator講座

01 バナー作成講座 まずは基本のサイズとフォント設定

在宅・フリーランスになるためのバナー作成講座 yoshiko先生 Webサイト制作で必要な要素のひとつ「バナー」このバナー作成講座では、基本の作り方をPhotoshop Illustratorを使って作成していきます。 はて...
Webサイト制作

19 ホームページ制作基礎講座 CSS編 footerを固定する

Yoshiko先生 HTMLのsection 内に入っている画像周りこみを制御するcss19回目となります。ここでは、ページの一番下に常にfooter が固定されている状態を作っています。 はてな女史 footer って、あのco...
Webサイト制作

18 ホームページ制作基礎講座 CSS編 float

Yoshiko先生 HTMLのsection 内に入っている画像周りこみを制御するcss18回目となります。画像と文章のまわりこみ「float」に関しての説明動画です。 はてな女史 フロートはがどうにもうまくできません。すごく壊れ...
Webサイト制作

17 HTMLとCSS講座 CSS編 text-shadow

Yoshiko先生 ホームページ制作基礎講座 17回目は、1セットのサイトを作ります。CSSでheader を書いていきます。text-shadow 使ってみました。ロゴぽく見えますかね〜 やりすぎると汚く見えてします影効果です。 ...
Webサイト制作

16 HTMLとCSS講座 HTML編

Yoshiko先生 ホームページ制作基礎講座 16回目は、HTMLコードを書く回です画像の横並びにfloat を書いて行きます。HTMLではemmet を使っているので div.content TABキーなどの <div clas...
Webサイト制作

15 HTMLとCSS講座 CSS編 隣接セレクタ編

Yoshiko先生 ホームページ制作基礎講座 15回目は、グローバルナビゲーションでよく使う隣接セレクタの書き方です。CSSです。 はてな? 隣接セレクタって何ですか?そもそもグローバルナビゲーションって? Yoshiko...
Webデザイン技能検定

学科 平成29年度 4回目(3級) ウェブデザイン技能検定

ウェブデザイン技能検定 学科 平成29年度 4回目(3級) ウェブデザイン技能検定3級 学科講座です。過去問よ平成29年度 4回目(3級)の過去問題をといて解説しています。 Yoshiko先生 第...
Webデザイン技能検定

学科 令話元年 3回目(3級) ウェブデザイン技能検定

ウェブデザイン技能検定 学科 令話元年 3回目(3級) ウェブデザイン技能検定3級 学科講座です。過去問より令話元年3回目(3級)の過去問題をといて解説しています。 ウェブデザイン技能検定3級 学科講座です。過去問よ...
Webデザイン技能検定

学科 令話元年 2回目(3級) ウェブデザイン技能検定

ウェブデザイン技能検定 学科 令話元年 2回目(3級) ウェブデザイン技能検定3級 学科講座です。過去問より令話元年2回目(3級)の過去問題をといて解説しています。 第1問 2 正しくない 音声は出る 第2問...
Webデザイン技能検定

学科 令話元年 1回目(3級) ウェブデザイン技能検定

ウェブデザイン技能検定 学科 令話元年 1回目(3級) ウェブデザイン技能検定3級 学科講座です。過去問より令話元年1回目(3級)の過去問題をといて解説しています。 第1問 2 正しくない 第2問 2 正しくな...
Webデザイン技能検定

学科 平成30年度 4回目(3級) ウェブデザイン技能検定

ウェブデザイン技能検定 学科 平成30年度 4回目(3級) ウェブデザイン技能検定3級 学科講座です。過去問より平成30年度 4回目(3級)の過去問題をといて解説しています。
Webデザイン技能検定

学科 平成30年度2回目(3級) ウェブデザイン技能検定

ウェブデザイン技能検定 学科 平成30年度 2回目(3級) ウェブデザイン技能検定3級 学科講座です。過去問より平成30年度 2回目(3級)の過去問題をといて解説しています。 H30-2-3_gakka_...
Webサイト制作

14 HTMLとCSS講座 HTML/CSS編 display:flex を検証!

yoshiko 14HTML/CSS中級となってまいりました。横並びの決定版 disply:flex を使います。12章・13章で紹介したCSS display:flex について細かい設定を行う動画です。display:flex...
Webサイト制作

13 HTMLとCSS講座 CSS編

12の続きです。ナビゲーションのあと、article  の中の section 内にCSSを適用させてます。 article にpadding 設定のあと、section設定を行います。margin などに気を使って設定していきます...
スポンサーリンク
タイトルとURLをコピーしました