タグ付けされた質問 「css」

これはコンパス101かもしれませんが、色のアルファ値を設定するミックスインを書いた人はいますか？理想的には、ミックスインに任意の形式の色定義を適用し、透明度を適用したいと思います。 @include set-alpha( red, 0.5 ); //prints rgba(255, 0, 0, 0.5); @include set-alpha( #ff0000, 0.5 ); //prints rgba(255, 0, 0, 0.5); @include set-alpha( rgb(255,0,0), 0.5 ); //prints rgba(255, 0, 0, 0.5);

86 css  sass  compass-sass  rgba 

テキスト行の回転と配置に問題があります。今では、機能するのは位置だけです。回転も機能しますが、位置決めを無効にした場合に限ります。 CSS： #rotatedtext { transform-origin: left; transform: rotate(90deg); transform: translate(50%, 50%); } htmlは単なるプレーンテキストです。

86 css  webkit  transform  css-transforms 

私は独特で苛立たしい問題を抱えています。単純なマークアップの場合： <table> <thead> <tr><th>1</th><th>2</th><th>3</th></tr> </thead> <tbody> <tr><td>a</td><td>b></td><td>c</td></tr> <tr class='odd'><td>x</td><td>y</td><td>z</td></tr> </tbody> </table> thead、tr、およびtrの奇数要素に異なる背景色の値を適用します。問題は、ほとんどのブラウザで、すべてのセルに、テーブルの行の色ではない不要な境界線があることです。Firefox 3.5でのみ、テーブルのセルに境界線がありません。 他の主要なブラウザでこれらの境界線を削除して、表に表示されるのは行の色が交互になるだけになるようにする方法を知りたいだけです。

86 html  css  html-table 

コードはここにあります：http：//lasers.org.ru/vs/example.html メインブロック（#page）の下の空きスペースを削除するにはどうすればよいですか？

86 css 

この表記法がよく使われているのを見てきましたが、これら2つの表記法の間に顕著な違いはありますか？ element#id { property: 0; } そして element#id { property: 0px; } 私が使用しproperty: 0px;、私はそれがクリーン探して見つけると、すべての時間を、しかし、ブラウザの解釈場合、私はわからないんだけど、実際に0pxは異なるより0。 どちらが良いか正しいか誰かが知っていますか？

86 css  properties  zero 

itemクラスとコンパクトな「修飾子」クラスがあります。 .item { ... } .item.compact { /* styles to make .item smaller */ } これで結構です。ただし、画面が十分に小さい場合にクラスを@media強制的.itemにコンパクトにするクエリを追加したいと思います。 最初に考えたとき、これは私がやろうとしたことです： .item { ... } .item.compact { ... } @media (max-width: 600px) { .item { @extend .item.compact; } } ただし、これにより次のエラーが発生します。 @media内から外部セレクターを@extendすることはできません。同じディレクティブ内でのみ@extendセレクターを使用できます。 スタイルをコピー/貼り付けすることなく、SASSを使用してこれをどのように達成しますか？

86 css  sass  media-queries 

Bootstrapを試していますが、コンテンツがスクロールされた場合にページからフッターが消えることなく、下部のフッターを修正するにはどうすればよいでしょうか。

86 html  css  twitter-bootstrap  footer 

<option>要素内で現在選択されている要素のスタイルを設定する方法はあり<select>ますか？ 次に、現在選択されているオプション要素に背景色を付けることができますか？そうすれば、閉じたドロップダウンに現在表示されているオプションのスタイルを設定できます。

86 html  css  css-selectors  pseudo-class 

私は持っています： バンドルしたいJSファイル。 CSSにコンパイルしたいLESSファイル（@importsを単一のバンドルに解決）。 私はこれらを2つの別々の入力として指定し、2つの別々の出力を持つことを望んでいました（おそらくextract-text-webpack-pluginを介して）。Webpackには、コンパイルを行うための適切なプラグイン/ローダーがすべてありますが、分離が気に入らないようです。 JSから直接LESSファイルを必要とする人の例を見てきました。 require('./app.less');Webpackにそれらのファイルをバンドルに含めるように指示する以外の理由がないなどの理由で、。これにより、エントリポイントを1つだけ持つことができますが、それは私には本当に間違っているようです-JSコードとは関係がないのに、なぜJSでLESSが必要なのですか？ 複数のエントリポイントを使用して、エントリJSとメインLESSファイルの両方を渡してみましたが、複数のエントリポイントを使用すると、webpackはロード時にJSを実行しないバンドルを生成します-すべてをバンドルしますが、わかりません起動時に何を実行する必要がありますか。 webpackを間違って使用していますか？これらの別々のモジュールに対してwebpackの別々のインスタンスを実行する必要がありますか？JSに混合しない場合は、JS以外のアセットにwebpackを使用する必要がありますか？

86 javascript  css  webpack  build  css-preprocessor 

次のようなCSSセレクターがあるレスポンシブメールテンプレートの例を見つけました。 a[class="btn"] これが完全に同じである場合、なぜこの構文が使用されるのですか？ a.btn モバイルブラウザなどに影響はありますか？

86 css  css-selectors 

どのようにして使用することができるvertical-alignだけでなく、float内divのプロパティ？をvertical-align使用しない場合は正常に動作しfloatます。しかし、フロートを使用すると、機能しません。float:right最後のdivにを使用することが重要です。 私は以下を試しています、すべてのdivからfloatを削除すると、正常に機能します： <div class="wrap"> <div class="left">First div, float left, has more text.</div> <div class="left2">Second div, float left </div> <div class="right">Third div, float right</div> </div> CSS： .wrap{ width: 500px; overflow:hidden; background: pink; } .left { width: 150px; margin-right: 10px; background: yellow; float:left; vertical-align: middle; display:inline-block } .left2 { width: 150px; margin-right: …

86 html  css  vertical-alignment 

設定されたサイズを維持するためにhtmlテーブルが必要なページを書いています。テーブルの上部にあるヘッダーを常に表示する必要がありますが、テーブルに追加された行数に関係なく、テーブルの本体もスクロールする必要があります。 このURLのメソッド2のように見せたい：http：//www.cssplay.co.uk/menu/tablescroll.html これを試しましたが、スクロールバーが表示されません。 tbody { height: 80em; overflow: scroll; } <table border=1 id="qandatbl" align="center"> <tr> <th class="col1">Question No</th> <th class="col2">Option Type</th> <th class="col1">Duration</th> </tr> <tbody> <tr> <td class='qid'></td> <td class="options"></td> <td class="duration"></td> </tr> </tbody> </table> コードスニペットを実行する結果を非表示スニペットを展開

86 html  css  scroll  html-table  overflow 

card-deckとcardクラスを使用するブートストラップの例の1つを覗いていました（価格設定の例）。リストの1つに他のリストよりもアイテムが少ない場合、ボタンの配置を修正するにはどうすればよいのでしょうか。 すべてのボタンを（各カードの下部に）垂直に配置したいのですが、これを行う方法がわかりませんでした。.align-bottomクラスを設定し、ボタンをでラップしてみました<div class="align-text-bottom">。また、スペースの追加に関するこの質問からのいくつかの提案を試しましたが、それでも成功しません（また、リストの残りのスペースを埋めるように間隔を可変にする必要があります）。 折り返す<div class="card-footer bg-white">と、カードの下部にあるボタンが整列せず、その周りに何らかの境界線が作成されるため、目的の結果が得られませんでした。 誰かアイデアがありますか？ 編集：これは問題に似たjsfiddleです。

86 html  css  twitter-bootstrap  bootstrap-4 

1つの宣言でマージンまたはパディングを設定するための省略形プロパティの順序を思い出せません。あれは： margin-top: 2px; margin-bottom: 4px; margin-left: 3px; margin-right: 8px; 次のように書くことができます margin: 2px 8px 4px 3px; はい、正午から時計回りに時計を考えることで、順序を視覚化できることを理解しています。しかし、私はそれを忘れ続けています。上、右、下、左の順序をテキストで思い出す必要があります。 したがって、TBLRTRBL。 この[R-名詞] [B-動詞] [L-名詞]のようなものがおそらく行く方法ですが、私は自分自身にインスピレーションが不足していると感じています。誰かがこれに役立つニーモニックに出くわしたことがあれば、私はそれを聞きたいです。良いミームのように、脳に何かが詰まったら、それを忘れることはないでしょう。 注：この質問は誤った情報を提供しました-順序（コメントと回答の一部に記載されているように）は右上下左下です。（ええ、私が何を意味するのか分かりますか？-dland）

85 css  mnemonics 

私はdivを持っています： <div class="test" id="someElement" style="position: absolute"></div> 特定の要素があるかどうかを確認する方法はありますか？ $("#someElement") 特定のクラス（私の場合は「テスト」）があります。 あるいは、en要素が特定のスタイルを持っていることを確認する方法はありますか？この例では、要素に「position: absolute」があるかどうかを知りたいです。 どうもありがとうございました！

85 javascript  jquery  css