sementic tags & web

5165 ワード
テキストリンク
ラベルを大きく分けると、BoxかItemと呼ばれます.🐶
引っ越しのことを考えると、箱には何が入っていて、物は箱の中に入っているのではないでしょうか.
ネット上の箱は実は見えない友達たちです.

このように箱と道具のラベルがあります!
片付け始めましょうか?
まず道具を箱に入れて、それから箱を適当な位置に置いてください.

箱はこのように固定的な位置がありますハハ!
通常はboxタグでdivと書きますが、正しい部分に分けるのが望ましいです:)
いつdivを使うの?
->テキストやボタンを縛ってborderにあげたり、background-colorにあげたいときに使ったりすることができます.
Web上では、Articleがこれらの部分に再アクセスします.
What are Semantic Elements?
一言で「有意義なsemantic tag!」と言ってもいいですね~
仮想要素は、指定したボックスの位置のように、ブラウザや開発者に自分の意味を明確に説明します.<div><span>箱より<form><table><article>箱の位置がよくわかるでしょう?
<article>	내용을 정의한다.

<aside>		페이지 콘텐츠를 제외한 콘텐츠를 정의한다. 링크, 광고, 사이드바 표시 등.

<details>	사용자가 보거나 숨길 수있는 추가 세부 정보를 정의한다.

<figcaption>	<figure> 요소에 대한 캡션을 정의한다.

<figure>	일러스트레이션, 다이어그램, 사진, 코드 목록 등과 같은 자체 포함 된 콘텐츠를 지정한다.

<footer>	문서 또는 섹션의 바닥글을 지정한다. 주로 저작권, 연락처 정보 등 내용이 삽입되며 <header>, <section>, <article> 등 다른 레이아웃 사용가능.

<header>	문서나 섹션의 머릿글을 지정한다. 사이트 맨 위쪽이나 왼쪽에 사용하며 헤더 안에 <form> 태그를 이용, 검색창을 넣거나 <nav>태그를 이용해 사이트메뉴를 넣는다.

<main>		문서의 주요 내용을 지정한다.

<mark>		강조표시된 텍스트를 정의한다. 형광펜을 칠한 것처럼 노랗게 칠해진다.

<nav>		네비게이션 링크를 정의한다.
같은 사이트내의 링크나 다른 사이트로의 링크들의 모음이다.

<section>	<header>, <footer>와 함께 문서의 구역을 정의한다.
<section>안에 <section>을 넣을 수도 있고, <article>을 이용해 내용을 넣는다.

<summary>	<details> 요소를 위한 눈에 보이는 제목을 정의한다.

<time>		날짜/시간을 정의한다.
自己常用sql整理バックアップ
installation of Python module