メモ: CSS

ラベル CSS の投稿を表示しています。すべての投稿を表示

css #2：block要素を中央に配置するには？

margin-left、margin-right に auto を指定すれば良い。

CSS

css #1：display プロパティ

display プロパティ

※ 参考 https://developer.mozilla.org/en-US/docs/Web/CSS/display

指定可能な主な値：
・block

・要素は縦に並ぶ
・幅と高さを指定できる
・上下左右の余白(margin、padding)を指定できる
・text-align、vertical-alignの指定はできない

・inline

・要素は横に並ぶ。右端までいくと改行
・基本的にはblockの中で用いる
・幅と高さを指定できない。要素の中身で自動決定
・上下の余白は指定不可。左右は指定可
・text-align(親要素で指定)、vertical-alignが指定可

・inline-block

・要素は横に並ぶ。右端までいくと改行
・幅と高さを指定できる
・上下左右の余白(margin、padding)を指定できる
・text-align(親要素で指定)、vertical-alignが指定可

・none

非表示にする

CSS

css：ul / liの横並び

以下サイトを読んで学習していたが、「単純なカレンダー」のような画面を作るにはどうしたらいいか？　直ぐに思いつかなった。
https://developer.mozilla.org/ja/docs/Learn/JavaScript/Building_blocks/conditionals

cssを使わずに行うと以下のようになってしまう。

用語：Tailwind CSS

Tailwind CSS
てーるうぃんどう CSS

※ 参考：Tailwind CSSとは？ユーティリティファーストの意味…｜Udemy メディア

『Tailwind CSS』とは、Utility First（ユーティリティファースト）をコンセプトに設計されたCSSフレームワークのこと

ユーティリティファースト？

CSSは使わずにTailwind CSSが提供しているクラスのみを使用してスタイリングする考え方のこと

※ 次回記事：Processing

用語, CSS

HTML #2：HTML中にCSSを記述するには？

CSSを別ファイルにせずにHTML中に記述方法
いつも忘れるのでメモ
前回記事：HTML #1：取り消し線

head - style要素にCSSを記述する。

<head>
  <style>
    h1 {
      font-size: large
      　：
    }
  </style&ｇｔ；ｇｔ；
</head>

ネットで検索すると style要素にtype属性 "text/css" が記述された例を見かけるが、
HTML5でtype属性はは不要らしい。

次回記事：HTML #3：TABLEに罫線を書く

HTML学習, CSS学習

メモ：CSS：子セレクタ (E > F)

■ 子セレクタ (E > F)｜セレクタ｜CSS HappyLife ZERO

子セレクタ（子共セレクタ）は、親要素の直接の子要素に適用されるセレクタです。このため、孫要素以下は対象になりません。

#main > p {
  color: #f00;
}

[メモ][CSS]