0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

HTML/CSSの自分流基礎

Posted at

HTMLの基礎

HTMLには、ブロック要素とインライン要素がある。
ブロック要素の中にインライン要素を書くことはできるけど、その逆はできない

ブロック要素同士を連続で書くと縦に並ぶことになります。 一方、インライン要素のタグを連続で書くと横に並びます。

属性について

id属性:様々なHTMLタグで使われる。要素に好きな「固有名」を付ける
class属性:様々なHTMLタグで使われる。要素に好きな「分類名」を付ける
src属性:imgタグ(画像を表示するタグ)で使われる。画像ファイルの置き場所を示す
href属性:aタグ(ハイパーリンク)で使われる。リンク先を示す

要素について

コンテンツエリア…内容が表示される部分
padding…要素の中に割り当てられている余白
border…要素の境界
margin…隣接する要素との余白

box-sizing

border-boxは指定したwidth,heightはborder,padding,コンテンツエリアの合計になる。

line-height

高さというよりは、行間を開けるイメージ

vertical-align

text-alignが水平方向で、vertical-alignは垂直方向

letter-spacing

文字の間隔の調整

float

floatを使うと横並びにできる、clear:bothとすればfloatをクリアできる。

flex

flexはfloatより自由に要素の位置を指定できる。
まず、要素の親にdisplay:flexと指定。

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

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?