Webデザイナーの教科書(初級)
未経験からの基礎講座・どなたでも、ご自由にお使いください。
● CSSがセットになったレッスンファイルをダウンロードする。
● HTML基本構文
● CSS Reset-YUI- 公式サイト
● Font AwesomeCDN 5.11.2 cdnjs.com
● CSSがセットになったレッスンファイルをダウンロードする。
● HTML基本構文
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="UTF-8">
</head>
<body>
</body>
</html>
● CSS Reset-YUI- 公式サイト
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.18.1/build/cssreset/cssreset-min.css">
● Font AwesomeCDN 5.11.2 cdnjs.com
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<link href="https://code.jquery.com/jquery-3.4.1.js.css" rel="stylesheet" type="text/css">
手放す動物(心理テスト)
ライオン・牛・羊・猿・馬の5種類の動物を連れて旅に出ました。この動物たちと協力し合って道中は、とても楽しい旅でした。 と…
背景に動画を使用する(vol.①)
背景に動画を使用する① 動きがあって、インパクト効果抜群。動画を読み込む方法はいくつかありますが、容量が重いものもあるの…
ベンダープレフィックスとは
ブラウザごとに異なる表示 比較的古いバージョンのブラウザ環境では、CSS3が適用されません。 そこで、各ブラウザごとに用…
ページ内リンクをスルスル
smooth-scroll ページ内のリンクを移動する際に、「スルスル」と快適に移動させる演出があります。急にページが切…
レイアウト基本練習-①
基本を練習してみましょう。ワイヤーフレームで書き出して解説します。 同じパターンを繰り返すので、クラスセレクタを利用しま…
自由制作課題(1年)
1年生による自由制作課題 習得２ヶ月による１年生の自由制作課題集です。ベーシック認証がかかっております。パスワード等はお…
グローバルメニューを移動し固定する
ヘッダーの直下にあるナビゲーションが、スクロールすると、ページトップの位置に固定されるように実装します。 ▶…
レイアウト基本練習②
Webサイトは、「画像」と「テキスト」がペア組みとなり、一つの要素となっているものが非常に多くあります。そのペアの仕様も…
レスポンシブWebデザインとは
レスポンシブWebデザイン（Responsive Web Design）は、PC、タブレット、スマートフォンなど、あらゆ…
レイアウト基本練習③
ホテルニューオオニタ サムネイル(画像)・タイトル・説明の3つの要素をひとつの要素として扱います。li要素やp要素を使っ…
