たとえば、写真を表示させたいとき
・タグは「写真を出すよ！」という宣言をする
・属性は 「このフォルダの中にあるよ！」「この写真を使って！ 」などの細かい指示をする
< img >タグの属性名は src alt
↓これは「画像を出すよ！」という命令です。
< img >
でも、どの写真を使うのかが分からないので、写真を表示できません。
属性は細かい指示をする
さあ、ここで属性の登場です！
下の図はカレーの写真を出すための要素です↓
・要素についての記事はこちらから→「 要素 」って何？ ブロック要素とインライン要素を一発で見分ける方法！
・写真表示についての記事はこちらから→写真（画像）の表示を理解しよう！<img>タグとは？
要素を解体してみるとこのようになります
もっと噛み砕いて説明するとこのようになります↓
細かい指示を受けることで、「これですね！」と表示させてくれます
どのタグにも使える属性名 class
classは属性の名前になります。
classも属性になりますが、よく見ると、色々なタグにclassが使われているのが分かります
< p >、< h1 >、< div >、< span >などの、どんなタグに使えます。
では、詳しくみていきましょう！
< p >タグで宣言し、 class の属性で細かい指示をします
細かい指示を受けることで表示することができます
< img >タグの属性は、src ・alt ですが、classはどんなタグにも使えます！
・クラスについての記事はこちらから→HTMLのclassの使い方！を分かりやすく解説！
< a >タグの属性名は href
< a >タグは リンク を作るタグです。読んだ人がクリックすると、ほかのページやサイトへ飛べるようにするタグです
属性のルールはかんたん！
１タグの中に書く
２属性名と値を＝でつなぐ
３値はダブルクオーデーション “” で囲む
まとめ
・属性は「タグにくっつける説明書」みたいなもの！
・属性名＝” 値 ” の形で書く
・タグによって使える属性は決まっている
次回はリンクについて学びましょう！
コメント