Progate
HTML&CSS 初級編
<h1>タグ 見出し
<p>タグ 文章
タグは改行
リンクを入れる
<a>タグ href属性と組み合わせ
<a href=””>ここに文字を入れる</a>
画像を入れる
<img src=”ここに画像のURLを入れる”>
終了タグは無い
<!– –>でコメント記入可能
<ul>タグ 黒点
<li>リストタグ
親要素・子要素の関係
囲む方が親・囲まれる方が子(インデントが下がる方)
<ol>タグで数字が連番
CSS
h1 {
color :#fff :
}
h1がセレクタ、color・・がプロパティ
CSSのコメントは/* */で囲んだら。
フォントサイズプロパティ
font-size: 10px;
pxで調整
font-family: フォント名;
でフォントを指定できる
フォント名に空白がある場合はダブルクオーテーションで囲む
font-family: “Avenir Next”;
ゴシック・明朝体などの指定可能
font-family: serif;
font-family: Yumincho;
font-family: sans-serif;
font-family: “Lucida Grande”
<li>タグが複数ある場合、一つのリスト要素だけ色を変えるためにはどうすればいいか
(特定の要素にCSSを適用するには)
要素にはクラスを使って名前をつけられる
classをつけることで要素ごとに別々のCSSを適用できる
class名でCSSを適用する場合、先頭に「.」(ドット)が必要
同じclass名をつけた要素すべてに反映する
<!DOCTYPE html>宣言
<head>要素の中に入れる必須の3項目
①文字コードの指定
<meta charset=”utf-8″>
②ページタイトルの設定
<title>タイトル名</title>
ブラウザのタブの名前になる
③CSSの読み込み
<link rel=”stylesheet” href=”stylesheet.css”>
<div>要素
divisionの略で要素をグループ化する
<div class=”header”>
</div>
<div class=”main”>
</div>
<div class=”footer”>
</div>
コメント