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

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


7
AngularJSにビュー/部分的な特定のスタイリングを含める方法
アプリケーションが使用するさまざまなビューに個別のスタイルシートを使用する適切な/受け入れられる方法は何ですか? 現在、view / partialのhtmlの上部にlink要素を配置していますが、最近のすべてのブラウザーがそれをサポートしているにもかかわらず、これは悪い習慣であると言われていますが、それが不快な理由がわかります。 他の可能性は、index.htmlに個別のスタイルシートを配置するheadことですが、パフォーマンスの名前でビューがロードされている場合にのみ、スタイルシートをロードします。 CSSがサーバーから読み込まれるまでスタイリングが有効にならず、遅いブラウザーでフォーマットされていないコンテンツがすばやくフラッシュするので、これは悪い習慣ですか?ローカルでテストしているのですが、これはまだ見ていません。 Angularに渡されたオブジェクトを介してCSSをロードする方法はあり$routeProvider.whenますか? 前もって感謝します!

14
位置:iPadとiPhoneでは修正されません
私はしばらくの間、iPadの固定位置に苦労しています。私はiScrollを知っていますが、(デモでも)常に機能するとは限りません。Senchaにはその修正が含まれていることも知っていますが、その修正のソースコードはCtrl+ できませんでしたF。 私は誰かが解決策を持っていることを願っています。問題は、iOS搭載のモバイルSafariでユーザーがパン/アップしたときに、固定された要素が更新されないことです。
132 iphone  css  ipad  ios  mobile 

18
AdobeフォントをIE9のCSS3 @ font-faceで動作させる
小さなイントラネットアプリケーションを作成している最中ですが、最近購入したAdobeフォントを使用しようとしました。私が知らされたように、私たちの場合、それはライセンス違反ではありません。 フォントの.ttf / .otfバージョンを.woff、.eot、.svgに変換し、すべての主要なブラウザーをターゲットにしました。私が使用した@ font-face構文は、基本的にFont Springの防弾構文です。 @font-face { font-family: 'MyFontFamily'; src: url('myfont-webfont.eot'); src: url('myfont-webfont.eot?#iehack') format('eot'), url('myfont-webfont.woff') format('woff'), url('myfont-webfont.ttf') format('truetype'), url('myfont-webfont.svg#svgFontName') format('svg'); } HTTPヘッダーを変更し(Access-Control-Allow-Origin = "*"を追加)、クロスドメイン参照を許可しました。FFとChromeでは完全に機能しますが、IE9では次のようになります。 CSS3111: @font-face encountered unknown error. myfont-webfont.woff CSS3114: @font-face failed OpenType embedding permission check. Permission must be Installable. myfont-webfont.ttf フォントを.ttf / .otfから.woffに変換するときに、.afmファイルも取得されることに気付きましたが、それが重要かどうかはわかりません... それを解決する方法はありますか? [編集] -IIS 7.5で …

4
Google Pagespeedの「スクロールせずに見えるコンテンツ」とは何ですか?
最近まで、私のサイト(www.heatexchangers.ca)はGoogle Page Speedで98%のスコアを付けていました。Webフォントのクエリ文字列など、私が何もできないことがいくつかありました。これが私にできることすべてを表していたので、私はこれにとても満足していました。 最近、Googleはページ速度のスコアに影響を与える何か他のものを追加しました、そして私は今ページ速度で89%だけを得て、この提案を得ます: スクロールせずに見えるコンテンツで、外部のレンダリングをブロックするJavaScriptとCSSを排除します。 これを修正するための提案には、すべての.cssファイルと.jsファイルを調べ、それらの一部を分離して、それらをhtmlにインラインで追加することが含まれるようです。私はできるだけ多くのJSとCSSをHTMLから除外する必要があるという印象を受けていたので、これは私にいくつかの混乱を引き起こしています。 「フォールドの上」のコンテンツとは正確には何ですか?フォント、背景色などのいくつかのスタイルの場合。そうすれば、インラインに含めるにはそれほど大きな取引ではないかもしれません。これが正確に何であるかのリストを見つけることができませんでした。

8
JSを使用せずに画像をドラッグまたは選択できないようにする
JavaScriptに頼らずに、Firefoxで画像をドラッグも選択もできないようにする方法を誰かが知っていますか?ささいなことのようですが、ここに問題があります: 1)Firefoxでドラッグして強調表示できます。 <img src="..."> 2)これを追加しますが、ドラッグ中に画像を強調表示することができます: <img src="..." draggable="false"> 3)これを追加して、強調表示の問題を修正しますが、直感に反して、画像は再びドラッグ可能になります。おかしい、わかった!FF 16.0.1の使用 <img src="..." draggable="false" style="-moz-user-select: none;"> では、なぜ「-moz-user-select:none」を追加すると、どういうわけか「draggable = false」が切り捨てられて無効になる理由を知っていますか?もちろん、webkitは期待どおりに動作します。これについてはインターウェブ上には何もありません...これにいくつかの光を当てることができれば素晴らしいと思います。 ありがとう!! 編集: これは、UI要素が誤ってドラッグされないようにし、使いやすさを向上させることです。
132 css  html  firefox  draggable 

9
CSSを使用してHTMLアンカータグをクリック/リンクできないようにすることは可能ですか?
たとえば、私がこれを持っている場合: <a style="" href="page.html">page link</a> リンクをクリックできないようにし、page.htmlに移動しないようにするスタイル属性に使用できるものはありますか? または、アンカータグで「ページリンク」を単にラップしない唯一のオプションですか? 編集:人々がより良いアドバイスを提供できるように、なぜこれをしたいのかを述べたいと思います。開発者が希望するナビゲーションスタイルのタイプを選択できるように、アプリケーションをセットアップしようとしています。 だから、私はリンクのリストを持っています、そして1つは常に現在選択されています、そして他のすべてはそうではありません。選択されていないリンクについては、通常のクリック可能なアンカータグにしたいのは明らかです。しかし、選択されたリンクについては、リンクをクリックしたままにすることを好む人もいれば、クリックできないようにしたい人もいます。 これで、選択したリンクの周りにアンカータグをプログラムでラップしないだけで簡単にできます。しかし、選択したリンクを次のようなもので常にラップできる場合は、よりエレガントになると思います: <a id="current" href="link.html">link</a> 次に、開発者がCSSを介してリンクスタイルを制御できるようにします。
132 html  css  anchor 


9
HTML IMGタグを使用してアスペクト比を維持する方法
アプリケーションの写真を表示するためにHTMLのimgタグを使用しています。高さと幅の両方の属性を64に設定しました。画像の解像度(256x256、1024x768、500x400、205x246など)を64x64として表示する必要があります。しかし、imgタグの高さと幅の属性を64に設定すると、アスペクト比が維持されないため、画像が歪んで見えます。 参考までに、私の正確なコードは次のとおりです。 <img src="Runtime Path to photo" border="1" height="64" width="64">
132 html  css 

3
子がフローティングしているときに親divの高さがゼロになるのはなぜですか
私のCSSには以下があります。すべてのマージン/パディング/ボーダーはグローバルに0にリセットされます。 #wrapper{width: 75%; min-width: 800px;} .content{text-align: justify; float: right; width: 90%;} .lbar{text-align: justify; float: left; width: 10%;} HTMLを次のように書くと <div id="wrapper"> <div class="content"> some text here </div> <div class="lbar"> some text here </div> </div> ページは正しくレンダリングされます。しかし、要素を検査すると、高いdiv#wrapperと表示され0pxます。私はそれが最後まで拡大すると思っていました、div.contentそして、div.lbarなぜこれが起こるのですか? この場合も、ページは正常にレンダリングされます。この行動は私を困惑させるだけです。
131 html  css 

1
コードとマークアップQ&Aのサンプル画像[終了]
閉まっている。この質問はスタックオーバーフローのガイドラインを満たしていません。現在、回答を受け付けていません。 この質問を改善してみませんか?Stack Overflowのトピックとなるように質問を更新します。 5年前休業。 この質問を改善する 画像を含むMCVE / SSCCEを準備する場合、画像に直接アクセスできると便利です。 ほとんどの質問をカバーする画像のタイプは、複数の色または形状の小さな画像、透明度あり/なしのアニメーションGIF、画像の「ペア」であり、画像遷移、タイルセット、スプライトシートで使用できるJPEGです。 これらのタイプの例にホットリンクできる小さな(30KB未満の)オンサイトのライセンス&ロイヤリティフリーの画像はありますか?
131 java  javascript  css  image 

5
Aタグに幅と高さを設定する
アンカータグの幅と高さをピクセル単位で設定できますか?アンカータグ内にテキストを保持しながら背景画像を配置したいのですが。 li { width: 32px; height: 32px; background-color: orange; } li a { width: 32px; height: 32px; background-color: red; } <li><a href="#">Something</a></li> コードスニペットを実行する結果を非表示スニペットを展開
131 html  css  cross-browser 

9
iPhoneのように、HTMLテキスト入力ボックス内にクリアボタンを配置するにはどうすればよいですか?
クリックすると<INPUT>ボックスのテキストがクリアされる、素敵な小さなアイコンが欲しいのですが。 これは、入力ボックスの外側に明確なリンクを設けるのではなく、スペースを節約するためです。 CSSのスキルが弱い... これがiPhoneの外観のスクリーンショット写真です。
131 javascript  iphone  html  css 

4
Lessコンパイラーで16進数の色をRGBAに変換するにはどうすればよいですか?
私は次のコードを持っています: @color : #d14836; .stripes span { -webkit-background-size: 30px 30px; -moz-background-size: 30px 30px; background-size: 30px 30px; background-image: -webkit-gradient(linear, left top, right bottom, color-stop(.25, rgba(209, 72, 54, 1)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(209, 72, 54, 1)), color-stop(.75, rgba(209, 72, 54, 1)), color-stop(.75, transparent), to(transparent)); に変換@colorする必要がありrgba(209, 72, 54, 1)ます。 したがってrgba(209, 72, …
131 css  less 

7
箇条書きにFont Awesomeアイコンを使用し、リストアイテム要素を1つにする
Font Awesome(http://fortawesome.github.com/Font-Awesome/)アイコンをCMSの順序なしリストの箇条書きとして使用できるようにしたいと考えています。 CMSのテキストエディターは生のHTMLのみを出力するため、追加の要素/クラスを追加できません。 つまり、マークアップが次のようになったときにアイコンを表示します。 <ul> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> </ul> 最初の問題は、Font Awesomeが別のfont-family属性を必要とするかどうかを確認することができます。 これは純粋なCSSを使用して可能ですか?または、jQueryのようなものを使用して、各リスト項目の先頭に要素を追加する必要がありますか? 背景画像のフォールバックを使用できることは承知していますが、可能であればFont Awesomeを使用することをお勧めします。
131 css  font-awesome 

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