HTMLのみを使用し、Q&Aなどで使われるアコーディオンメニューを付けたいと思ったことはありませんか。
今回はHTMLだけを使って、クリックすることでテキストが展開され、新しい情報を提示する、アコーディオンメニューを作る方法について解説してきます。
HTML
inputタグのchecked属性？ラジオボタン等をチェックがついた状態にをする方法
チェックボックスやラジオボタンに元からチェックがついている状態にする方法を知っていますか。
この記事ではinputタグのchecked属性を使って、チェックボックスやラジオボタンに元からチェックがついている状態にする方法を解説していきます。
続きを読むlabelタグとinputタグを関連付ける？その方法、メリットを紹介【HTML初心者向け】
ユーザーの満足度を向上させるためにlabelタグとinputタグを使う方法を知っていますか。
今回はHTMLのlabelタグとinputタグを関連付けることによって、どのようなメリットがあるのか、また、どのようにしてlabelタグとinputタグを関連付けるのかを解説していきます。
続きを読むチェックボックスとラジオボタンの使い分け方を紹介『input type=”checkbox/radio”』
inputタグを用いて、作ることのできるチェックボックスとラジオボタンですが、それぞれがどのように使われるか理解していますか。
今回はチェックボックスとラジオボタンの特徴を解説しながら、それぞれどのような場面で使われるべきなのかを解説していきます。
続きを読む【誰でもできる】ラジオボタンの作り方徹底解説 『input type=”radio”』
サイトのフォームの中などに頻出するラジオボタンを使ったことがない人はいないのではないでしょうか。
便利で頻出するラジオボタンですが、今回はそんな誰もが使ったことのあるラジオボタンを今日からでも作れるように丁寧に解説していきます。
結論：ラジオボタンは<input type=”radio”>で作る
続きを読むHTMLだけで同一ページ内の特定の場所にジャンプする方法
リンクが埋め込まれた見出しなどをクリックした時に、その見出しの場所までジャンプするようなサイトを見たことはありませんか。
今回はそのような同一ページ内の特定の場所にジャンプする方法を詳しく解説していきます。
結論：HTMLのid属性を使ってサイトの特定の場所にジャンプする
続きを読む【コピペあり】リストにCSSだけでチェックマークを付ける方法とは？
リストの中でそれぞれの項目を強調させるようなチェックマークを見たことはありませんか。
今回はそのようなリストの項目に付いているチェックマークをCSSだけで作る方法を解説していくと共にコピペが出来るコードについても紹介させていただきます。
結論：チェックマークはプロパティ『border』を変形させて使う
続きを読む【CSS初心者向け】blockとは？ブロック要素の特徴を分かりやすく解説
CSS『display: block;』などで指定できるブロック要素をしっかりと理解していますか。
重要な要素ですが、その知識をあやふやなまま使用していることも少なくないと思います。今回はブロック要素の特徴を余さず、丁寧に解説していきます。
続きを読む【頻出デザイン】CSS『display: grid;』を使って表を作る方法を簡単解説
CSSのプロパティと値である『display: grid;』を知っていますか。
今回はそんなCSSのプロパティと値である『display: grid;』を使って、サイトに頻出する表を作っていきたいと思います。
『display: grid;』をまだ知らない方もこの記事を読んで、『display: grid;』を使いこなしていきましょう。
続きを読むolタグとulタグの違いとは？olタグは番号あり、ulタグは番号なし【HTML初心者向け】
HTMLでリストを作るためのolタグとulタグ、この2つは似たような個性を持つタグですが、その特徴をそれぞれ理解しているでしょうか。今回はolタグとulタグについてそれぞれの違いを中心にその使い方について解説していきます。
結論：リストに番号ありはolタグ、番号なしはulタグ
続きを読む