HTML・CSSのトラブル– tag –

HTMLコーディングで発生しがちなミス HTMLは文法ミスがあっても明示的なエラーが発生しないため、文法ミスに気付きにくいというデメリットがあります。そのためブラウザで表示させた時にレイアウトの崩れを確認して、はじめて文法ミスがあったことに気付く...

input要素のソフトウェアキーボードとは input要素のソフトウェアキーボードとは、スマートフォンやタブレットなどでinput要素にフォーカスした時、画面の下側に表示される仮想的なキーボードのことです。 このソフトウェアキーボードは、input要素などに...

突然Webサイトのボタン（aタグ）がクリックできなくなったら Webサイト制作をしていると、突然リンクやボタン、aタグがクリックできなくなる問題に直面することがあります。この原因は様々ですが、今回は突然リンクやボタン、aタグがクリックできなくなっ...

Contact Form 7で作ったフォームにCSSが反映されない場合はどうすればよいのか？ WordPressを使用しているWebサイトがContact Form 7で作ったフォームにCSSが反映されないという話を耳にすることがあります。どのような場合であれ、CSSが反映されないこと...

口ひげテンプレートの概要 口ひげテンプレート（Mustache template）とは、{{ }}の記号を使うことにより、簡単に「もし～～があったら、～～する。（if…then…）」という条件分岐を作ることができるロジックレスのテンプレートシステムです。 例えば下記の...

便利なamp-listのトラブル amp-listはAMPページに組み込めるコンポーネントの１つで、読み込んだJSONファイルの内容を一定のルールに従って繰り返してくれます。通常のWebページを作るよりも制限が強いAMPページで関連記事を連続で表示させたい時にamp-lis...

Minifyの概要 CSS Minifier を使ったCSSの圧縮 Minify（ミニファイ）とは、JavaScript（以下、JSと略記）やCSSのコード内の不要な改行やインデントを削除して、動作はそのままの状態で、圧縮・軽量化することをいいます。日本では「ミニファイする」とはあ...

ブートストラップ (Bootstrap) とは ブートストラップ（Bootstrap）は、Twitter社が開発したWebサイト制作時に役立つCSSのフレームワークのことをいいます。ブートストラップは現在オープンソースで開発されており、誰でも無償で使用することができ、 デザ...

CSSをコーディングしている時に不意にでたエラー Visual Studio CodeでCSSをコーディングしていると、突然参考画像のように"Do not use empty rulesets"というエラーが表示されました。これはいったいどのような意味を持っているのでしょうか？実はこのエ...

タグ機能・タグ編集機能をWebサイトに設置したい タグ編集機能の参考画像 Webサイトを作っていると、上の参考画像のようなタグ編集機能をつけたい時がままあります。とくに何かのアプリケーションのためのUIをHTML・CSSで作っている時に必要になることがあ...

四角形の左上・右上だけ角丸にする 四角形の四隅を角丸にするCSSにborder-radiusがあります。 border-radius: 1px; このような形式でCSSをかけることにより、指定した要素を角丸にすることができます。しかし、時には参考画像１の赤い部分のように、上だけ...

肩付けにするsupタグが効かない supタグとは何か？ supタグというものをご存知でしょうか？supタグを使用すると上付き文字を使用することができ、注釈などで利用することができます。（たとえばこのような形です[１]） しっかりと脚注を入れたいオウンドメ...