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
除外 -[タグ]
-リンゴ
高度な検索の詳細については、ヘルプ ページをご覧ください
でタグ付けされた検索結果
検索オプション answers only not deleted user 17324

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

1
承認済み

Ul, liで3分割された個別のイメージの縦横比率を黄金比にする方法

HTMLがないので詳細が不明ですが、元々の画像ファイルサイズを希望の比率にするのが一番効率的かと思います。 画像サイズを変更できない場合は希望の比率で透過pngなどを作成・表示し、 背景画像として画像を設定してみるのではいかがでしょうか。 background-sizeにcoverを指定することで背景領域を覆う最小サイズで表示されます。 <li><img src="hoge.png" alt= …
T.Sa's user avatar
  • 335
1

flocssについて

FLOCSSのページにも記載がありますが、 再利用可能なパターンはComponent、プロジェクト固有のものに関してはProject、それ以外の便利スタイルをUtilityに分類します。 管理できるように自分やプロジェクトチーム単位で決めるのが一番ですが、 迷った場合はProjectとして登録しておき、ある程度繰り返し登場するパターンだと判断したら逐一Componentとして登録し直すという形に …
T.Sa's user avatar
  • 335
1
承認済み

行ごとに背景色を変えるさえ、input要素も背景色をかえるには?

inputにも指定を当てる方法ではダメなのでしょうか? .trColor tr:nth-child(even), .trColor tr:nth-child(even) input { background-color: #edf7e8; } .trColor tr:nth-child(odd), .trColor tr:nth-child(odd) input { …
T.Sa's user avatar
  • 335
1

liの高さが中身のimgの高さより大きくなる。

img { vertical-align: bottom; } 上記を指定してみてください。
T.Sa's user avatar
  • 335
1

chromeのデベロッパーツールで「Responsive」表示にすると、<li>要素の下に細い線ができる。

img { vertical-align: bottom; }を追加してみてください。
T.Sa's user avatar
  • 335
-1
承認済み

paddihng、marginなどの変数を1ずつ上げていきたい時に下記のようにxを付けるしか方法が思いつかないのですが、どのように対処していますか?

例示のように1remずつ差をつけて使い分けることがあまりありません。 実際に例示されたように使用するのであれば、smallやmediumなどのような表現ではなくどの変数がどの値なのかわかるように命名したほうが良いのではないかと思います。 --margin-2r: 2rem; // --margin-2remの意 --margin-4r: 4rem; --margin-5r: 5rem;
T.Sa's user avatar
  • 335
1
承認済み

画面を小さくした時に2つ目の画像が文章に重なってしまう。

p { word-wrap: break-word; } を追加することで単語の途中でも強制的に改行するようにすれば大丈夫です。 例示のためにアルファベットを羅列しているため、単語の区切りが判別できないことで生じています。
T.Sa's user avatar
  • 335
2

CSSの変数について

質問が漠然としているため回答も粒度の細かいものは出せませんが、簡潔に回答をするとすれば、HTMLの構造も含めたCSS設計によって大きく異なります。 utilityという言葉がFLOCSSで用いられるような汎用クラスのことを指している場合、あくまでも「これだけで解決」するものではなく「合わないところは都度変更・上書きする」という大前提に基づいています。 …
T.Sa's user avatar
  • 335
0
承認済み

Slider Proでの角丸指定

slider-pro.cssにて.slider-pro img.sp-image { border-radius: 0 !important; }という指定があるため詳細度で上書きされている状態です。 cssの指定を.slider-pro img.sp-image { border-radius: 10px ! … important; }とし、slider-pro.cssより後に読み込むように変更してみてください。 …
T.Sa's user avatar
  • 335
3
承認済み

HTMLにCSSがうまく反映されない

CSSには優先度(詳細度)というものがあります。 その名の通り「どのスタイルを適応するか」を決めるもので、優先度が低い場合にはどれだけCSSを書いても適応されない場合があります。 最近のブラウザには開発者ツールが備えられており、そこで詳細度を確認することができます。 windowsの場合F12キーを押すとツールを開けますので、そこで確認してください。 CSS 詳細度 …
T.Sa's user avatar
  • 335
0
承認済み

IE11でエレメント要素にfilter:blur効果

Can I useで見る限り、IE11はfilter未対応のようです。 そのため、単純な方法では実現不可能だと思います。
T.Sa's user avatar
  • 335