はじめに 新人エンジニアの私がビューを作成しているときに犯したうっかりミスをいくつか紹介します。 反面教師にして、皆さんもお気をつけください。 新人エンジニアがView作成時にするうっかりミス ウ…

コンポーネントが正しく読み込まれない！ <table> <v-hoge-thead></v-hoge-thead> <tbody> <tr> <td>hogege</td> </tr> </tbo…

パターン1 イメージ HTML <a class="scroll" href="#link-about" data-scroll="" aria-label="scroll" title="scr…

概要 タイトルをクリックしたらコンテンツが開閉される。 Boxは配下は一つのページで複数表示されることを想定し、idでなくclassで制御している。 HTML <dl class="accordi…

概要 ページを開いたらローディングが表示され、指定の秒数が経ったらページ（要素）が見えるようにする。 使用するアニメーション（プラグイン） Loaders.css https://connorat…

指定のスクロール位置がブラウザトップに到達したらバナー（要素）を出現させる。 HTML <div id="floatBnr-start">バナーイン位置</div> <!-- 中略 --> <div…

フレックスボックスを使ってみよう 親要素にdisplay:flex;で横並び flex:1;と指定すると １つ目のボックスが伸びて、なおかつブラウザの幅に合わせて柔軟に幅が変わる。 関連用語につい…

CSSの基本セレクターを学んでみよう まず、 h1{ color:red; } h1をセレクター、color:red;を宣言と呼ぶ。 idセレクターを使おう id属性は同じページ内で同じ値を使って…

スタイルを継承を理解しよう 継承されるかどうか調べるときはMDNの仕様書を見る。 継承されないプロパティ例えばborderを子要素にも継承したかった場合、 子要素にinheritというキーワードを…