プログラミング css

9

CSSを使用して画像を「グレー表示」で表示する（つまり、個別のグレー表示されたバージョンの画像を読み込まずに）最良の方法（ある場合）は何ですか？私のコンテキストは、すべてのボタンが右端のセルにあるテーブルの行があり、一部の行は他よりも明るく見えるようにする必要があるということです。もちろん、フォントを簡単に軽量化することはできますが、各画像の2つのバージョンを管理する必要なく、画像を軽量化したいと考えています。

183 css

18

クロムではなくサファリのためのCSSハックはありますか？

クロムではなくサファリのみのcssハックを見つけようとしているのですが、どちらもWebkitブラウザーですが、クロムとサファリのdiv配置に問題があり、それぞれ表示が異なります。私はこれを使用しようとしましたが、それはクロムにも影響します、 @media screen and (-webkit-min-device-pixel-ratio:0) { #safari { display: block; } } 誰かがサファリに適用される別のものを知っていますか？

183 css safari

18

HTML / CSSを使用してテキストにスペース/タブを挿入する方法

可能な方法： <pre> ... </pre> または style="white-space:pre" 他に何か？

183 html css tabs space pre

9

Twitterのtypeahead.js提案はスタイル設定されていません（境界線がない、背景が透明など）

Twitterのtypeahead.js 0.9.3を使用していますが、私の提案はまったくスタイル付けされていません。私はこれを手に入れています：このようなものの代わりに：（例のページから取得）先行入力を有効にするJavaScript： $('.search-typeahead').typeahead({ name: 'videos', remote: { url: '/api/v1/internal/videos/typeahead?text=%QUERY' } }); HTML input要素： <input type="text" value="" id="search_keywords" class="no-clear search-typeahead"/> その他の注意事項：私が取り組んでいるサイトにはjQuery 1.10.1があり、Twitterブートストラップを使用していません。私が作成しなかったため、干渉しているのではないかと心配しているCSSがたくさんありますが、プラグインは独自のスタイルを追加しているようです（付随する.cssファイルはありません）。？なぜスタイルが機能するのか混乱していますが、プラグインによって追加されたものが機能せず、透明な背景、境界線なしなどの候補が表示されます。

182 javascript css typeahead.js

8

<div>タグとCssのみを使用してテーブルを作成する方法

<div>タグとCSS だけを使用してテーブルを作成したい。これは私のサンプルテーブルです。 <body> <form id="form1"> <div class="divTable"> <div class="headRow"> <div class="divCell" align="center">Customer ID</div> <div class="divCell">Customer Name</div> <div class="divCell">Customer Address</div> </div> <div class="divRow"> <div class="divCell">001</div> <div class="divCell">002</div> <div class="divCell">003</div> </div> <div class="divRow"> <div class="divCell">xxx</div> <div class="divCell">yyy</div> <div class="divCell">www</div> </div> <div class="divRow"> <div class="divCell">ttt</div> <div class="divCell">uuu</div> <div class="divCell">Mkkk</div> </div> </div> </form> …

182 html css

9

ページからブラウザの印刷オプション（ヘッダー、フッター、マージン）を無効にしますか？

この質問がSOおよび他のいくつかのWebサイトでいくつかの異なる方法で質問されるのを見ましたが、それらのほとんどは具体的すぎるか、古くなっています。私は誰かが推測に迷うことなくここで決定的な答えを提供できることを望んでいます。 CSSまたはJavaScriptのいずれかを使用して、誰かがブラウザー内で印刷するときにデフォルトのプリンター設定を変更する方法はありますか？そしてもちろん、「ブラウザからの印刷物」とは、PDFや他のプラグインに依存するMIMEタイプではなく、何らかの形式のHTMLを意味します。ご注意ください：一部のブラウザーがこれを提供し、他のブラウザーが提供しない場合（または一部のブラウザーでその方法を知っているだけの場合）、ブラウザー固有のソリューションを歓迎します。同様に、これを行うことに対して特定の制限がある主流のブラウザーを知っている場合は、それも役立ちますが、かなり最新のドキュメントをいただければ幸いです。（単に「XYZのセキュリティポリシーに反する」と言っても、XYZが過去3年間にこのポリシーに大幅な変更を加えた場合、あまり説得力がありません）。最後に、「デフォルトの印刷設定を変更する」と言ったとき、私は自分のページだけを意味するわけではありません。特に、印刷の余白、ヘッダー、およびフッターについて言及しています。 CSSには、ページの向きとページのマージンを変更するオプションがあることをよく知っています。多くの闘争の1つはFirefoxです。ページの余白を1インチに設定すると、既に配置されている1/2インチに追加されます。私はクライアントのサイトでPDFの使用を減らしたいと思っていますが、プレゼンテーションの侵害（および信頼性の欠如）が主な懸念事項です。

182 javascript html css browser printing

16

CSS3メディアクエリが機能しないのはなぜですか？

styles.cssでは、メディアクエリを使用しています。どちらも次のバリエーションを使用しています。 /*--[ Normal CSS styles ]----------------------------------*/ @media only screen and (max-width: 767px) { /*--[ Mobile styles go here]---------------------------*/ } サイトを縮小すると、通常のブラウザー（Safari、Firefox）で必要なレイアウトにサイトのサイズが変更されますが、携帯電話ではモバイルレイアウトがまったく表示されません。代わりに、デフォルトのCSSが表示されます。誰かが私を正しい方向に向けることができますか？

182 html css media-queries mobile-website

12

ブートストラップ付きの固定幅ボタン

Bootstrapは固定幅のボタンをサポートしていますか？現在、「保存」と「ダウンロード」の2つのボタンがある場合、ボタンのサイズはコンテンツに基づいて変わります。また、Bootstrapを拡張する正しい方法は何ですか？

182 css twitter-bootstrap

11

CSSでの最大文字長の設定

私は学校向けのレスポンシブウェブサイトを作成しています。私の質問は次のとおりです。 Webサイトで（CSSを使用して）文の最大文字長（75文字など）を設定するには、画面が非常に大きい場合、文が75文字を超えないようにします。私は最大幅を試しましたが、それは私のレイアウトを台無しにします。フレックスボックスとメディアクエリを使用して応答性を高めています。

182 html css text

13

ほとんどのピクセルを占める英語のアルファベットの文字はどれですか？

文の文字数に基づいて動的プログラミングを実行しようとしています。画面で最も多くのピクセルを占める英語のアルファベットの文字はどれですか。

181 css char

12

100％幅のテキストボックスがコンテナを超えて拡張するのを停止できますか？

行全体を埋めるテキストボックスがあるとします。私はそれに次のようなスタイルを与えます： input.wide {display:block; width: 100%} 幅はテキストボックスの内容に基づいているため、これにより問題が発生します。テキストボックスには、デフォルトでマージン、ボーダー、パディングがあり、幅が100％のテキストボックスはコンテナよりも大きくなります。たとえば、ここの右側：テキストボックスがコンテナの幅を超えて拡大することなく、コンテナの幅を満たす方法はありますかここに私が何を意味するかを示すいくつかのHTMLの例があります： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>Untitled Page</title> <style type="text/css"> #outer{border: 1px solid #000; width: 320px; margin: 0px;padding:0px} #inner{margin: 20px; padding: 20px; background: #999;border: 1px solid #000;} input.wide {display:block; margin: 0px} input.normal {display:block; float: right} …

181 html css

4

Z-indexが機能しないのはなぜですか？

だから私がz-index正しく理解していれば、この状況では完璧です：下の画像（タグ/カード）を、その上のdivの下に配置します。したがって、鋭いエッジは見えません。どうすればよいですか？ z-index:-1 // on the image tag/card または z-index:100 // on the div above どちらも機能しません。また、このような組み合わせもありません。どうして？

181 html css z-index

8

JavaScriptコードを使用してブラウザの幅を取得する方法は？

現在のブラウザーの幅を取得するJavaScript関数を記述しようとしています。私はこれを見つけました： javascript:alert(document.body.offsetWidth); しかし、ボディの幅が100％の場合、失敗するという問題があります。他にもっと良い機能や回避策はありますか？

180 javascript jquery html css

8

最後のフレームでCSS3アニメーションを停止する

クリックで再生する4部のCSS3アニメーションがありますが、アニメーションの最後の部分は画面からそれを取り除くことを目的としています。ただし、再生すると、常に元の状態に戻ります。誰でも、最後のcssフレーム（100％）でそれを停止する方法、または再生後にdiv全体を削除する方法を知っています。 @keyframes colorchange { 0% { transform: scale(1.0) rotate(0deg); } 50% { transform: rotate(340deg) translate(-300px,0px) } 100% { transform: scale(0.5) rotate(5deg) translate(1140px,-137px); } }

180 css css-animations

15

<select>フォームフィールドが無効になっているときに送信されるようにするにはどうすればよいですか？

私が持っているselect私は、ユーザーの値を変更することはできませんとして、「読み取り専用」としてマークすることをフォームフィールドを、その値は、まだフォームで送信されます。disabled属性を使用すると、ユーザーは値を変更できなくなりますが、フォームで値を送信しません。 readonly属性は、のためにのみ利用可能であるinputとtextareaフィールドが、それは私が欲しいものは基本的です。それを機能させる方法はありますか？私が検討している2つの可能性は次のとおりです。を無効にする代わりにselect、すべてのを無効にし、optionCSSを使用して選択をグレー表示して、無効になっているように見せます。フォームを送信する前に無効になっているすべてのドロップダウンメニューを有効にするように、送信ボタンにクリックイベントハンドラーを追加します。

180 javascript html css forms html-select

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

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