Quantcast
Channel: CSSタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 8664

HTML/CSS 基本の復習

$
0
0

ポイントポイント自分に必要なとこだけをただただ書き出し。

ブロックレベル要素とインライン要素

ブロックレベル要素は並べると、改行される。
インライン要素は並べると、改行されない。
しょっちゅう出てくる<div>はブロックレベル要素

曖昧なイメージで、ブロックライン要素はhtml作成に必ず必要な分。
インライン要素は必ずしも必要でないが、見た目を整えるのに寄与している。

セレクタとプロパティと値

cssの書き方

セレクタ {
   プロパティ : 値 ;
}

class

class1.html
<pclass="class1">class1</p>
class1.css
.class1{color:red;}

id

id.html
<pid=id1>id1</p>
id1.css
#id1{color:red}

classの方が一般的なので、とりあえずclass使っておけばOK

リセットCSS

ブラウザ毎の変化を抑えるために必要。

float

要素を指定位置表示。

clearfix

floatの副作用を解決。

clearfix.html
<divclass="aaa clearfix"></div>
clearfix.css
.clearfix::after{content:"";clear:both;display:block;}

リスト

ul 順序なしリスト
ol 順序ありリスト
li リスト中のブロック
list-style: none; 先頭の記号消し

table 一番外
th 見出し
tr 横定義
td ブロック

GUI

form 操作フォーム
input 入力フォーム
textarea 広い入力フォーム
placeholder 仮表示文字列
label 見出し

Flexbox(floatと同じ)

justify-content: *; 横並びのしかた
align-items: *
; 縦並びのしかた

ブロック配置位置

position: absolute; 要素の絶体位置指定
position: relative; 要素の絶体位置基準


Viewing all articles
Browse latest Browse all 8664

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>