2022-04-01から1ヶ月間の記事一覧
Animate On Scroll Library スクロールの動きに合わせてアニメーションを実装することができるプラグイン michalsnik.github.io CDN <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet"> <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script> HTMLでアニメーションを設定したい要素に属性を追加する data-aos…</link>
モバイルファースト - ハンバーガーメニュー HTML記述例 ナビゲーションは「モバイル用」と「PC用」と作成し、ボタンイベントで表示を切り替える <html lang="ja"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>【コーディング練習】CASABLANCA</title> <link rel="stylesheet" href="css/style.css"> </link></meta></meta></head></html>
ナビビゲーションを position で設定
ヘッダーパーツ - ナビゲーション nav要素のレイアウト nav <nav class="gnav"> <ul> <li><a href="#">ホーム</a></li> <li><a href="#">サービス案内</a></li> <li><a href="#">お問い合わせ</a></li> </ul> </nav> /* ---------------------------------- nav ---------------------------------- */ .gnav ul { display: flex; gap: 40px; colo…
ヘッダーパーツ ロゴとグローバルナビゲーション ロゴ作成 適宜作成 font-awesome CDN cdnjs.com マークアップ button要素でクリックできる要素とする（a要素で作成も可） 《index.html》 <html lang="ja"> <head> <meta charset="UTF-8"> <title>ヘッダーのパーツ</title> <link rel="stylesheet" href="css/style.css"> </link></meta></head></html>
