LoginSignup
0
0

More than 1 year has passed since last update.

プロパティでHTMLの要素を変更、HTMLの全体構造

Posted at

特定のセレクタだけプロパティをつける

<ul>
  <li class="selected">HTML</li>
  <li>...</li>
  <li>...</li>
</ul>
.selected {
  color: #ff0000;
}

htmlにclassをつけることによってそれだけをスタイルをつける対象にできる。
cssはクラス名を書きスタイルをつける。その場合は.selectedのように先に.をつけなければならない。

プロパティ

要素の見た目や役割を変えることができます。
出典 https://web-camp.io/magazine/archives/84609

HTMLの全体構造

<html>要素

HTML 文書においてルート (基点) となる要素 (トップレベル要素)
ルート要素とも呼ばれます。他のすべての要素は、この要素の子孫として配置しなければなりません。

<head>要素

・文書に関する機械可読な情報 (metadata)、たとえば題名、スクリプト、スタイルシートなどを含みます。
・文章全体の情報を定義するためのタグです。例えば、ページのタイトルや言語、ページを書いた人の情報などを定義します。

出典 https://it-biz.online/web-design/head/#toc1
・ ブラウザに表示されない

<meta>要素

文字コードの指定を指定する

<title>要素

ページのタイトルを指定する

<link>要素

cssの読み込みに使われる

rel

ファイルとの関係性を指定
出典 https://saruwakakun.com/html-css/basic/link-rel

href

そのファイルがある場所(URL)を指定
出典 https://saruwakakun.com/html-css/basic/link-rel

<body>要素

・HTML 文書のコンテンツを示す要素です。

要素は文書中に一つだけ配置できます。
・HTML文書のコンテンツ・内容を示す要素

出典 https://style.potepan.com/articles/20496.html#:~:text=body%E3%82%BF%E3%82%B0%E3%81%A8%E3%81%AF%E3%80%81HTML,%E3%81%AB%E8%A8%98%E8%BF%B0%E3%83%BB%E9%85%8D%E7%BD%AE%E3%81%97%E3%81%BE%E3%81%99%E3%80%82

<!DOCTYPE html>

正確に言えばHTMLのタグではありません。
文書の解釈に使うDTDを宣言
「DTD」とは「Document Type Definition」のことで、「文書型の定義」を意味

出典 https://html-coding.co.jp/annex/dictionary/html/doctype/

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0