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

CSS(Cascading Style Sheets)は、HTML(HyperText Markup Language)、XML(Extensible Markup Language)ドキュメント、および色、レイアウト、フォントを含む(これらに限定されない)SVG要素の外観とフォーマットを記述するために使用される表現スタイルシート言語です。とアニメーション。また、画面、紙、音声、またはその他のメディアで要素をレンダリングする方法についても説明します。

11
他のHTMLで<body>の<style>タグを使用する
&lt;html&gt; &lt;body&gt; &lt;style type="text/css"&gt; p.first {color:blue} p.second {color:green} &lt;/style&gt; &lt;p class="first"&gt;Hello World&lt;/p&gt; &lt;p class="second"&gt;Hello World&lt;/p&gt; &lt;style type="text/css"&gt; p.first {color:green} p.second {color:blue} &lt;/style&gt; &lt;p class="first"&gt;Hello World&lt;/p&gt; &lt;p class="second"&gt;Hello World&lt;/p&gt; &lt;/body&gt; &lt;/html&gt; ブラウザーは、連続していないCSSをどのようにレンダリングすることになっていますか?ページ上のすべてのcssスタイルを使用してデータ構造を生成し、それをレンダリングに使用することになっていますか? それとも、表示される順序でスタイル情報を使用してレンダリングしますか?
195 html  css 

12
CSS Divはページの高さを100%伸ばします
ページの左側にナビゲーションバーがあり、ページの高さの100%まで拡大したいと思います。ビューポートの高さだけでなく、スクロールするまで非表示の領域も含まれます。これを達成するためにJavaScriptを使用したくありません。 HTML / CSSで実行できますか?
195 css  height  max  stretch 

6
スタイルシート内のIE(すべてのバージョン)のみをターゲットにする方法は?
私は継承されたプロジェクトを持っていて、それが完全に混乱している場所があります。これはその1つです。IE(すべてのバージョン)のみをターゲットにする必要があります。 #nav li { float: left; height: 54px; background: #4f5151; display: table; border-left: 1px solid grey; } 明確にするために:埋め込みスタイルシート内で、HTMLのタグにIDまたはクラスを追加せずに、ユーザーがIEを使用している場合にのみ、ボーダースタイルを適用する必要があります。これどうやってするの? 編集:Firefoxの解決策を見つけ、これを反映するように質問を編集しました。
195 css 

11
ロード時のcss3遷移アニメーション?
JavaScriptを使用せずに、ページの読み込み時にCSS3遷移アニメーションを使用することは可能ですか? これは私が望むものの一種ですが、ページの読み込み時に: http://rilwis.googlecode.com/svn/trunk/demo/image-slider.html これまでに見つけたもの CSS3 transition-delay、要素への影響を遅延させる方法。ホバーでのみ機能します。 CSS3 Keyframe、ロード時に機能しますが、非常に遅いです。そのため役に立たない。 CSS3の移行は十分高速ですが、ページの読み込み時にアニメーション化しません。

9
テーブルの内側のみに境界線を適用するにはどうすればよいですか?
テーブルの内側にのみ境界線を追加する方法を理解しようとしています。私がする時: table { border: 0; } table td, table th { border: 1px solid black; } 境界線はテーブル全体とテーブルセルの間にあります。私が達成したいのは、テーブルのセルの周りのテーブルの内側にのみ境界線を付けることです(テーブルの外側の境界線なし)。 これは私がテーブルに使用しているマークアップです(それは重要ではないと思いますが): &lt;table&gt; &lt;tr&gt; &lt;th&gt;Heading 1&lt;/th&gt; &lt;th&gt;Heading 2&lt;/th&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;Cell (1,1)&lt;/td&gt; &lt;td&gt;Cell (1,2)&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;Cell (2,1)&lt;/td&gt; &lt;td&gt;Cell (2,2)&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;Cell (3,1)&lt;/td&gt; &lt;td&gt;Cell (3,2)&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; そして、ここに私が私のテーブルのほとんどに適用するいくつかの基本的なスタイルがあります: table { border-collapse: collapse; border-spacing: …
195 html  css  html-table  border 

6
かみそりビューで.cssファイルを参照する方法は?
_Layout.cshtmlファイルに.cssファイルを設定する方法は知っていますが、ビューごとにスタイルシートを適用するのはどうですか? ここでの私の考えは、_Layout.cshtmlには操作する&lt;head&gt;タグがありますが、非レイアウトビューの1つではそうではないということです。&lt;link&gt;タグはどこに行くのですか?
195 css  asp.net-mvc  razor 

6
Amazon CloudFrontからS3経由でgzip圧縮されたCSSおよびJavaScriptを提供する
私は自分のサイトの読み込みを速くする方法を探していましたが、探求したい1つの方法はCloudfrontをより活用することです。 CloudfrontはもともとカスタムオリジンCDNとして設計されておらず、gzip圧縮をサポートしていなかったため、これまでのところ、私のサイトコードでCloudfront cnameによって参照され、farで最適化されたすべての画像をホストしています。 -futuresヘッダー。 一方、CSSとjavascriptファイルは自分のサーバーでホストされています。これまで、Cloudfrontからgzipで提供することはできず、gzipによる利益(約75%)がそれよりも大きいという印象がありました。 CDN(約50%)の使用から:Amazon S3(およびCloudfront)は、gzip圧縮のサポートを示すためにブラウザーから送信されるHTTP Accept-Encodingヘッダーを使用して、標準的な方法でgzip圧縮されたコンテンツの提供をサポートしませんでした。そのため、Gzipを実行してコンポーネントをその場で提供することができませんでした。 したがって、私は今まで、2つの選択肢から選択する必要があるという印象を受けていました。 すべてのアセットをAmazon CloudFrontに移動し、GZippingを忘れます。 コンポーネントを自己ホストし、受信リクエストを検出し、必要に応じてオンザフライのGZippingを実行するようにサーバーを構成します。これは、これまでのところ私が選択した方法です。 この問題を解決するための回避策はありましたが、基本的にこれらは機能しませんでした。[ リンク ]。 現在、Amazon Cloudfrontはカスタムオリジンをサポートしているようです。カスタムオリジン [ リンク ] を使用している場合、gzip圧縮されたコンテンツを提供するために標準のHTTP Accept-Encodingメソッドを使用できるようになりました。 今のところ、サーバーに新機能を実装することはできません。上記にリンクしたブログ投稿は、変更の詳細を確認した唯一の記事ですが、カスタムオリジンを選択した場合、gzip圧縮(バーの回避策、私は使用しない)のみを有効にできることを意味しているようです。どちらかといえば、Cloudfrontサーバーで対応するフィールドをホストし、そこからリンクする方が簡単だと思います。ドキュメントを注意深く読んだにもかかわらず、私は知りません: 新しい機能が、ファイルがカスタムオリジンを介して自分のドメインサーバーでホストされる必要があることを意味するかどうか。 cssおよびjavascriptヘッダーを構成して、Cloudfrontからgzipで提供されるようにする方法。

24
HTMLページからの画像のドラッグを無効にする
ページに画像を配置する必要があります。その画像のドラッグを無効にしたいのですが。私はたくさんのことを試みていますが、助けはありません。誰かが私を助けてくれますか? 画像のサイズを変更しているので、その画像を背景画像として保持したくない。
194 javascript  jquery  html  css  image 

8
CSSを使用するとキャンバスは引き伸ばされますが、「幅」/「高さ」プロパティは通常です
私は2つのキャンバスを持っています。1つはHTML属性widthを使用heightし、それをサイズ変更するために、もう1つはCSSを使用します。 &lt;canvas id="compteur1" width="300" height="300" onmousedown="compteurClick(this.id);"&gt;&lt;/canvas&gt; &lt;canvas id="compteur2" style="width: 300px; height: 300px;" onmousedown="compteurClick(this.id);"&gt;&lt;/canvas&gt; Compteur1は通常どおりに表示されますが、compteur2は表示されません。コンテンツはJavaScriptを使用して300x300のキャンバスに描画されます。 なぜ表示に違いがあるのですか?
194 css  html  canvas  height  width 

28
CSS @ font-faceはFirefoxでは機能しませんが、ChromeおよびIEでは機能します
次のコードは、Google Chromeベータ版とIE 7で動作します。ただし、Firefoxにはこの問題があるようです。私のCSSファイルがどのようにインクルードされているかが問題であると思っています。クロスドメインのインポートに関してFirefoxがあまり友好的ではないためです。 しかし、これはすべて静的HTMLであり、クロスドメインの問題はありません。 landing-page.htmlで、次のようなCSSインポートを実行します。 &lt;link rel="stylesheet" href="../css/main.css" type="text/css" media="screen, projection" /&gt; main.css内に、次のような別のインポートがあります。 @import url("reset.css"); @import url("style.css"); @import url("type.css"); そしてtype.css内で私は次の宣言をしています: @font-face { font-family: "DroidSerif Regular"; src: url("font/droidserif-regular-webfont.eot"); src: local("DroidSerif Regular"), url("font/droidserif-regular-webfont.woff") format("woff"), url("font/droidserif-regular-webfont.ttf") format("truetype"), url("font/droidserif-regular-webfont.svg#webfontpB9xBi8Q") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "DroidSerif Bold"; src: url("font/droidserif-bold-webfont.eot"); src: local("DroidSerif …

2
ブートストラップグリッドシステムでネストされた行?
次のような2x2形式の1つの大きな画像と4つの小さな画像が必要です。 私の最初の考えは、すべてを一列に収めることでした。次に、2つの列を作成し、2番目の列で2つの行と2つの列を作成して、1x1と2x2の効果を作成します。 しかし、これは可能ではないようです、または私はそれを正しく行っていませんか?

11
ChromeデベロッパーツールのスタイルパネルのCSS変更を保存する方法
CSSの変更保存する方法スタイルパネルのGoogle Chromeのデベロッパーツールを? ツールのウェブサイトで、リソースパネルのすべての変更を確認できると記載されています しかし、CSSファイルでローカルで作業していますが、リソースパネルに変更が表示されません ところで、ChromeデベロッパーツールのCSS変更を保存するためのアドオンやツールはありますか? 私はFirebugについて多くのhttps://stackoverflow.com/search?q=firebug+CSS+changes+saveがあることを知っています

4
ajax(jQuery)のタイムアウトを設定する
$.ajax({ url: "test.html", error: function(){ //do something }, success: function(){ //do something } }); 時にはsuccess機能は時々 、良いではない動作します。 このajaxリクエストのタイムアウトを設定するにはどうすればよいですか?たとえば、3秒でタイムアウトになった場合、エラーが表示されます。 問題は、ajaxリクエストが完了するまでブロックを凍結することです。サーバーが少しの間停止している場合、それは決して終わりません。
194 javascript  jquery  html  css  ajax 

14
アウトラインとボーダーの違い
CSSの 'border'プロパティと 'outline'プロパティの違いを知っている人はいますか?違いがない場合、同じものに2つのプロパティがあるのはなぜですか?
194 css 

4
display:flexを使用して、残りの垂直スペースをCSSで埋めます
3列レイアウトの場合: 上の行はその内容に応じてサイズを調整する必要があります 下の行はピクセル単位で固定された高さでなければなりません 真ん中の行はコンテナを埋めるために拡大する必要があります 問題は、メインコンテンツが展開すると、ヘッダーとフッターの行が圧縮されることです。 HTML: &lt;section&gt; &lt;header&gt; header: sized to content &lt;br&gt;(but is it really?) &lt;/header&gt; &lt;div&gt; main content: fills remaining space&lt;br&gt; x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt; &lt;!-- uncomment to see it break - -&gt; x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt; x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt; x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt; x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt;x&lt;br&gt; &lt;!-- --&gt; &lt;/div&gt; &lt;footer&gt; footer: fixed height in px &lt;/footer&gt; &lt;/section&gt; CSS: section { …
194 css  layout  flexbox 

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.