Skip to main content
Search type Search syntax
タグ [タグ]
完全一致 "ここの単語"
作成者 user:1234
user:me (あなたの)
スコア score:3 (3+)
score:0 (なし)
回答 answers:3 (3+)
answers:0 (なし)
isaccepted:yes
hasaccepted:no
inquestion:1234
閲覧数 views:250
コード code:"if (foo != bar)"
セクション title:リンゴ
body:"リンゴ オレンジ"
URL url:"*.example.com"
セーブ in:saves
状態 closed:yes
duplicate:no
migrated:no
wiki:no
種類 is:question
is:answer
除外 -[タグ]
-リンゴ
高度な検索の詳細については、ヘルプ ページをご覧ください
でタグ付けされた検索結果
検索オプション not deleted user 4236

CSS(Cascading Style Sheets)とは、HTMLやXMLをどのように装飾するかを規定する仕様。従来のHTMLを、「構造」と「体裁」を分離するために提唱された。CSSでは、各メディアに合わせて表示を変更することが出来るほか、デフォルトの状態から複数のプロパティを上書きしていくことも可能である。

3

css 命名の質問

CSSクラス名に困る時点で、適切なスタイル・文書構造でない可能性があります。 …
sayuri's user avatar
  • 4.3万
6

input[type=checkbox] に対して :before, :after 疑似要素が使えるのはChromeだけ?

::beforeや::afterは対象となる要素のコンテンツの先頭および末尾に疑似的に要素を追加するものです。 <style> div::before{ content: 'abc'; } </style> <div>def</div> は <div><div::before />def</div> であり <div>abcdef</div> と …
sayuri's user avatar
  • 4.3万
4

「position: static」は相対位置指定ではない?

そもそも「相対位置」というからには基準となる位置が存在します。つまりposition: relativeはposition: staticの位置からの相対位置です。
sayuri's user avatar
  • 4.3万
7
承認済み

::before,::after擬似要素の親要素は?

5.12.3 The :before and :after pseudo-elementsより The ':before' and ':after' pseudo-elements can be used to insert generated content before or after an element's content. つまり、::before及び::afterはite …
sayuri's user avatar
  • 4.3万
4
承認済み

CSSセレクタでアスタリスクを使う場合 *[foo="bar"] と省略した場合 [foo="bar"] は等価ですか?

Selectors Level 3 - 6.2. Universal selectorに説明がありますが、同じです。 *[hreflang|=en] and [hreflang|=en] are equivalent, *.warning and .warning are equivalent, *#myid and #myid are equivalent. なお N …
sayuri's user avatar
  • 4.3万
9
承認済み

CSSのposition:relativeで、left%だけが効いて、top%が効かないのはなぜ? topをpx指定にすると効きます

HTML / CSSでは子要素のサイズが確定しないことには親要素のサイズを決定できません。そのため親要素をheight: 0pxと仮定してレイアウトされたために子要素のtop: 50%も0pxとして扱われたのでしょう。 body { height: 300px; } のように明示的な指定があれば、子要素のtop: 50%も効きます。 …
sayuri's user avatar
  • 4.3万
2
承認済み

position:absolute;でtop及びleft未指定時の挙動について(初期値は?)

position: absolute;が指定されるとその要素が存在しなかったものとして以降の要素が配置されます。結果としてThreeとFourは重なります。しかし、Fourはmargin相殺により20px上に配置されるため、Threeが下にずれたような印象を受けます。padding: 20pxと比較したり、margin-topとmargin-bottomを異なる値にするとわかりやすいかと思います。 …
sayuri's user avatar
  • 4.3万
0
承認済み

pタグ間の空白を0にしたい

margin: 1rem auto;} } 不正な閉じ括弧のせいでCSSが解釈されていません。 …
sayuri's user avatar
  • 4.3万
1
承認済み

display:flexにおける子要素の動き

align-content: flex-start;(既定値はstretch)でしょうか。
sayuri's user avatar
  • 4.3万
2
承認済み

Flexboxで、1行に並ぶボックスの数を指定したい。

まずflexboxの設定として上下両端に合わせと左右両端に合わせにより四隅に配置されるように準備します。 .container { align-content: space-between; justify-content: space-between; } 次に幅100%のダミー要素を用意することで、いつでも溢れて改行されるように準備します。 .container::after …
sayuri's user avatar
  • 4.3万
1
承認済み

Flexboxで、flexプロパティとwidthでの%指定の違いは?

widthは要素単独で決定される幅です。一方、指定された幅でレイアウトした後に余白部分をどう分け合うかを指定するのがflex-growです。 たまにフォントなどの都合で指定通りのwidthにならず、縦に積み重なるように崩れてしまっているWebサイトを見かけたりしますが、Flexbox及びflex-growを使用したレイアウトをしていれば意図しない折り返しを防ぐことができるかと思います。
sayuri's user avatar
  • 4.3万
1

absoluteでは回り込みができない?

position: absolute は absolute 要素のためのスペースが確保されません。 とあるように、他の要素は当該要素が存在しなかったものとしてレイアウトが行われます。当然回り込むことはありません。 記載されている質問文だけではどのようなレイアウトを検討されているか第三者にはわかりませんので、上記動作を念頭にスタイルを検討してください。
sayuri's user avatar
  • 4.3万
2

web用画像の解像度は72ppiと教えられましたが最近は…?

なお、現在はCSSメディアクエリを用いることによってデバイスのサイズや解像度に応じてスタイルを切り替えることができます。 複数の解像度で画像を用意しておき、デバイスに応じて選択されることをお勧めします。 …
sayuri's user avatar
  • 4.3万
0

CSS の background-image で指定した画像が反映されない

D:\~とはじまるものですが、あっていますか? D:\~ という形式はセキュリティ上、表示できません。仮にbackgroud-imageとして表示されたとしても、このファイルは質問者さんのパソコンにしか存在しないため、第三者の環境では表示されることはないわけですが、HTMLの作成目的を見失っていませんか?
sayuri's user avatar
  • 4.3万
4
承認済み

JavaScriptでIDやClassではない要素の取得

CSSセレクターで表現できる内容であれば要素を取得できます。 // 最初のみ document.querySelector('[hoge="C"]'); // 該当するすべて document.querySelectorAll('[hoge="C"]'); …
sayuri's user avatar
  • 4.3万

15 30 50 件 / ページ