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

固定幅と高さを指定したいdivと、元のDIVの幅/高さを減らしたり増やしたりせずに変更できるパディングがあります。そのためのCSSトリックはありますか、またはパディングを使用する代替はありますか？

93 css  html 

だから私はこのコードをここに持っています： <table> <tr> <td width="200px" valign="top"> <div class="left_menu"> <div class="menu_item"> <a href="#">Home</a> </div> </div> </td> <td width="1000px" valign="top">Content</td> </tr> </table> CSSを使って .left_menu { background: none repeat scroll 0 0 #333333; border-radius: 5px 5px 5px 5px; font-family: Arial,Helvetica,sans-serif; font-size: 12px; font-weight: bold; padding: 5px; } .menu_item { background: none repeat scroll …

93 html  css  html-table  width 

divを本文の任意の部分に挿入しposition: absolute、position: relative。を持つ親要素ではなく、ドキュメント全体を基準にしてdivを作成しようとしています。

93 html  css  css-position 

div他の要素に影響を与えずに画面の上部にスティックを作成し、その子要素を中央に配置したいと思います。 .parent { display: flex; justify-content: center; position: absolute; } <div class="parent"> <div class="child">text</div> </div> コードスニペットを実行する結果を非表示スニペットを展開 position: absolute行を追加するjustify-content: centerと無効になります。それらは互いに競合しますか、そして、解決策は何ですか？ 編集 みんなありがとう、それは親の幅の問題です。しかし、私はReact Nativeを使用しているため、設定できませんwidth: 100%。しようとしましたflex: 1とalign-self: stretch、両方が動作していません。結局、Dimensionsを使用してウィンドウの全幅を取得し、それが機能しました。 編集 React Nativeの新しいバージョン（私は0.49を使用しています）の時点で、を受け入れますwidth: 100%。

93 css  react-native  flexbox 

してくださいノート、ないスタイルパネル（私はグレー表示どのように適用文脈ないで手段を知っている）が、オーバー次のパネル、計算結果のプロパティパネル。 Computedプロパティがグレー表示されているとはどういう意味ですか？ 例：

93 css  google-chrome  google-chrome-devtools 

JavaScriptを使用してCSS：hoverプロパティを変更する方法を見つける必要があります。 たとえば、次のHTMLコードがあるとします。 <table> <tr> <td>Hover 1</td> <td>Hover 2</td> </tr> </table> そして次のCSSコード： table td:hover { background:#ff0000; } JavaScriptを使用して、<td>ホバープロパティをたとえばbackground：＃00ff00に変更したいと思います。JavaScriptを使用してスタイルの背景プロパティにアクセスできることを知っています。 document.getElementsByTagName("td").style.background="#00ff00"; しかし、私は：hoverに相当するJavaScriptを知りません。JavaScriptを使用してこれらの<td>の：hover背景を変更するにはどうすればよいですか？ あなたの助けは大歓迎です！

93 javascript  html  css  dhtml 

Rubyベースのトランスパイラーほど簡単ではなかったので、libsassのセットアップに苦労していました。誰かが方法を説明できますか： libsassをインストールしますか？ コマンドラインから使用しますか？ gulpやgruntなどのタスクランナーで使用しますか？ 私はパッケージマネージャーの経験がほとんどなく、タスクランナーの経験もほとんどありません。

93 css  sass  gulp-sass  node-sass  libsass 

画像のsrcを要素にバインドしようとしていますが、機能していないようです。「無効な式。生成された関数本体：{backgroundImage：{url（image）}」が表示されます。 ドキュメントには、「ケバブ・ケース」や「キャメルケース」のいずれかを使用することを言います。 <div class="circular" v-bind:style="{ backgroundImage: { url(image) }"></div> ここにフィドルがあります：https：//jsfiddle.net/0dw9923f/2/

93 javascript  html  css  vue.js 

これが問題の実例です（FirefoxとChromeでテスト済み）： <div style="background-color: red;"><svg height="100px" width="100" style="background-color: blue;"></svg></div> コードスニペットを実行する結果を非表示スニペットを展開 JSFiddleで表示 青redのdiv下の内側の余分なスペースに注意してくださいsvg。 paddingとmargin両方の要素をに設定しようとしまし0たが、運がありませんでした。

93 html  css  svg 

まず、CSSタグについて言及しています。 私はグーグルで@apply検索しましたが、その意味を正しく説明できるものは何も見つかりませんでした。 そのようなタグの使用法は何ですか？

93 css 

ここの私のページに問題があるようです：http： //www.lonewulf.eu サムネイルにカーソルを合わせると、画像が少し右に移動し、Chromeでのみ発生します。 私のCSS： .img{ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter:alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; -khtml-opacity: 0.5; display:block; border:1px solid #121212; } .img:hover{ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); -moz-opacity: 1; opacity: 1; -khtml-opacity: 1; display:block; }

92 css  image  google-chrome  hover  opacity 

別のビューのHTMLに動的に挿入しようとしているブートストラップ2.32モーダルがあります。Codeigniter 2.1を使用しています。ブートストラップモーダル部分ビューをビューに動的に挿入した後、次のようにします。 <div id="modal_target"></div> 挿入のターゲットdivとして。ビューに次のようなボタンがあります。 <a href="#message" class="btn btn-large btn-info" data-action="Message" data-toggle="tab">Message</a> 私のJSは： $.ajax({ type : 'POST', url : "AjaxUpdate/get_modal", cache : false, success : function(data){ if(data){ $('#modal_target').html(data); //This shows the modal $('#form-content').modal(); } } }); メインビューのボタンは次のとおりです。 <div id="thanks"><p><a data-toggle="modal" href="#form-content" class="btn btn-primary btn-large">Modal powers, activate!</a></p></div> これは、部分ビューとして個別に保存したいものです。 <div id="form-content" class="modal …

92 javascript  jquery  css  twitter-bootstrap  twitter-bootstrap-2 

流動的なレイアウトで、サイドバーナビゲーションを常にスクロールに固定することは可能ですか？

92 css  twitter-bootstrap  css-position  fluid-layout 

この特定のCSSセレクターを追加:not(:empty)すると、動作しなくなってしまいました。他のセレクターのどの組み合わせでも問題なく動作するようです。 input:not(:empty):not(:focus):invalid { border-color: #A22; box-shadow: none } :not(:empty)パーツを外しても問題なく動作します。セレクターを変更しても、input:not(:empty)テキストが入力されている入力フィールドは選択されません。これは壊れていますか:empty、:not()それともセレクタ内での使用が許可されていませんか？ 私が考えることができる他の唯一のことは、ブラウザにはまだ子がないので要素は空であると言っていることです。ん:emptyセレクタは、定期的な要素対の入力要素のための独立した機能を持っていませんか？ただし:empty、フィールドで使用してフィールドに何かを入力すると、代替の効果がなくなるためです（フィールドが空ではなくなるため）。 Firefox 8およびChromeでテスト済み。

92 html  css  css-selectors 

現在、本文の選択を無効にするためにこれをbodyタグに入れています。 body { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } しかし、私inputとtextareaボックスは、今選択不可です。これらの入力要素のみを選択可能にし、残りを選択不可にするにはどうすればよいですか？

92 css