■ Webデザインを学ぶ【初級/後編】
初心者から学ぶ基礎と解説による練習問題となっています。2020年現在、専門学校で使用しています。多くの方に利用いただければ幸いです。
body全体に枠を入れる
ボーダーをボディ全体を囲む ボーダーを使ったデザイン演出を紹介します。
box-sizing
ボックスサイズの算出方法 通常、ボックスのサイズを指定する際、ボックスは、マージン・パディングの値を含めて算出します。 …
トランジションでじんわり
フォバーするとじわっと背景が変化 (PC対応のみ) トップ 会社概要 サービス 採用情報 お問い合わせ ナビゲーション復…
CSSアニメーション①
[transform] transformとは 移動、回転、伸縮、傾斜の設定ができる 【指定できる値】 rotate ロ…
モバイルフレンドリー
meta name=”viewport” ページがすべてのデバイスに対応していることをブラウザに知らせるには、 ドキュメ…
レイアウト基本練習③
ホテルニューオオニタ サムネイル(画像)・タイトル・説明の3つの要素をひとつの要素として扱います。li要素やp要素を使っ…
ヘッダーの重要性
最も重要コンテンツなヘッダー要素 Webサイトは、上から順に読み込まれていきます。ユーザーは、ページ最上部左上から「Z」…
ワンコ大好き(PC版)
サンプル通りに実装してみてください。多少の記述の差異は、問題ありません。主要であるブラウザで問題なくレイアウトが整ってい…
favicon(ファビコン)を設定する
ファビコンとは ▶︎ 資料を見る favicon(ファビコン)は、ウェブサイトのシンボルマーク・イメージと…
Drawer Menu
ドロワーメニュー Flexible drawer menu using jQueryを使った簡単な 「Drawer」を使…