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 |
除外 |
-[タグ] -リンゴ |
高度な検索の詳細については、ヘルプ ページをご覧ください。 |
CSS(Cascading Style Sheets)とは、HTMLやXMLをどのように装飾するかを規定する仕様。従来のHTMLを、「構造」と「体裁」を分離するために提唱された。CSSでは、各メディアに合わせて表示を変更することが出来るほか、デフォルトの状態から複数のプロパティを上書きしていくことも可能である。
1
票
CSSで @max- :unit(); という記述のしかたって?
CSS としては文法間違いです。
LESSでの変数 @max-600 と @max-540 を定義しているように見えますが、何かの手違いで CSS ファイルに残っているのでしょう。 …
1
票
複数tableの各セル幅を同一にしたい
各tableの幅を同一にします。
(下記スニペットではわかりやすいよう各カラムに色付けをしました。)
<style>
table {
width: 80%;
}
.width100{
width:100px;
}
.width150{
width:150px;
}
.tb-fix{
table-layout:fixed;
}
.td-fix{
…
2
票
承認済み
transformで斜めにならない
https://drafts.csswg.org/css-transforms/#transformable-element
transformable element
A transformable element is an element in one of these categories:
all elements whose layout is governed … by the CSS box model except for non-replaced inline boxes, table-column boxes, and table-column-group boxes [CSS2],
all SVG paint server elements, the <clipPath> element and SVG renderable elements …
3
票
inputタグにてplaceholderの文字サイズを小さくした時の、Chromeの挙動がおかしい
Google Chrome はプレースホルダを周辺のベースラインに沿って配置するようなので、おかしな動作とは言い難い感じです。
vertical-align: middle も効かないようなので、
気にしないで放置する
Google Chrome のときだけ position:relative; top:-4px を適用するよう工夫する
でいいと思います。
3
票
承認済み
テキストを囲うdiv枠を、文字の長さに応じて常にcssで正円に表示したい
border-radius で円を作るなら、aspect-ratio でボックスが正方形になることを保証して、flexible box でセンタリングするのはいかがでしょうか。
div{
display: inline-flex; /* センタリングのため変更 */
border-radius: 50%;
background-color: yellow;
aspect- …
2
票
承認済み
テキストエリア内の中央で、画像をbackgroundとして使ってそれを丸形で表示させるには
別解:
clip-pathというCSSプロパティがありますが、clip-path: circle(50px); のように指定するとマッチする要素のものが丸く切り取られて表示されます。ただし、これは背景画像ではなくて要素全体(この場合、<textarea>全体)が切り取られますので、clip-pathを指定するだけでは目的の動作にはなりません。 …
2
票
flexboxの孫要素にheight:100%が効かない理由はなぜですか
flexboxに限らないのですが、今の状況は
flex-child に height 指定がないので、flex-child の高さは flex-childの子供要素 flex-grandchildren の高さで決まります
flex-grandchildren の高さは、flex-child の高さの100%です
相互依存しているため、高さが決まりません。
flex-child に he …
2
票
CSS のwidth定義(%指定)について、親要素・兄弟要素との関係をおさらいしたい
問題を再現できる完全なコードを示すとより回答しやすいと思います。
input要素のマージンだと思われます。マージンは親要素の値を継承しません。
完全なスタイルがわからないので推測ですが、box-sizing プロパティはデフォルトで content-box なため、width プロパティの値はボーダーとパディングを除いた幅を指定することになります。そのため、td と input の width …
3
票
承認済み
CSS のwidth定義(%指定)について、親要素・兄弟要素との関係をおさらいしたい
テーブルセル幅をパーセント指定したい場合は、table-layout: fixed の指定とともに、width を指定する必要があります。そうしないと、セルの幅を計算するための基準となる包含ブロックの幅が定まりません。
例:
table {
table-layout: fixed;
width: 100%;
...
}
1
票
承認済み
Date#toLocaleDateStringで和暦を扱う場合、西暦を扱う場合と比較してパフォーマンスが落ちてしまう問題を解決したい
以前の質問と全く同じ問題で、和暦に切り替える条件もまったく変わっていませんので、以前の回答と同じように解決できます。
状態を表現する変数を作る
最後に表示した日付がどのロカールだったかを、グローバル変数などに保持します。前回のコードの lastYearLocale
最後に表示したデータを保持する変数を作る
toLocaleDateString()の結果を使い回すために、最後に表示した日付をグロ …
0
票
承認済み
JavaScriptで画面スクロール時のクラスの切り替えができない
スクロール後の件のa要素のclass属性はlogo scrolled_fontになります。この場合、.logo と .scrolled_font のセレクタの詳細度(specificity) は同じなので、スタイルシートのソースコード上で後のルールが優先されます。.logoのほうが後に書かれているので、font-size: 24px;が採用されます。
対処方法はいくつかあります。
ソースコー …
3
票
CSSだけでdisplay: noneをかけた要素の大きさを保持したい
CSSのボックスツリーから外れるため、他のプロパティもいっさい効力がなくなります。親のボックスで大きさを確保するしかありません。
visibility: hidden や opacity: 0 で消すのはいかがでしょうか。 …
1
票
承認済み
CSS の background-image で指定した画像が反映されない
CSSのurl()の中に書くのは、URLです。ファイルパスではありません。URLなのでディレクトリ区切りは \ ではなく / です。この場合、
background-image: url(file:///D:/Users/foo/.../img/bar.png);
のように file:/// で始める絶対URLにするか、
background-image: url(.. …
5
票
承認済み
クラス名にコロン(:)は許可されているのでしょうか?
https://drafts.csswg.org/selectors/
https://drafts.csswg.org/css-syntax-3/
https://html.spec.whatwg.org/multipage/
https://dom.spec.whatwg.org/ …
1
票
JavaScriptとCSSのアニメーションはどちらが速い?
CSS transition と requestAnimationFrame() の双方とも、ハードウェアのリフレッシュレートに従って描画が更新されます。よって、CPUが十分に速ければどちらでもFPSは同じになります。
CPUが遅かったりアニメーション処理や他の処理が重いとき、requestAnimationFrame() のほうがFPSが落ちやすくなります。 …