問題タブ [stylesheet]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
7243 参照

html - この "width: auto" スタイルが両方のブラウザーでインライン スタイルとして機能するのに、IE でのみ外部スタイルシートに移動すると機能しなくなるのはなぜですか?

「幅: 100%」にデフォルト設定されている INPUT 要素があります。これにより、その隣にある他の要素が次の行に押し出されます。これを一時的に修正するために、次のように要素にインライン スタイル属性を追加しました。

これはうまくいきました。ここで、一時的な修正をクリーンアップするために戻り、すべてのスタイルをスタイル属性から外部スタイルシートに移動します。この特定の「幅: 自動」スタイルをスタイルシートに移動すると、Firefox では問題なく表示されますが、IE ではそれを無視し、デフォルトで再び「幅: 100%」になり、その隣の要素が再び吹き飛ばされます。

IE の Web 開発者用ツールバーは、スタイルがどこから来ているのかを教えてくれません。そのため、何が起こっているのかを診断するのは困難です。私の最善の推測は、IE で優先される何かが他にあるということですが、それが何であるかはわかりません。

編集: IE 開発者バーで右クリックしようとしたことを誓いますが、そうではないと思います-IE で「幅: 100%」で「スタイルをトレース」すると、「1. 一致しません」というポップアップが表示されます。ただし、Firefox では、この INPUT もカバーする「#outer foo bar INPUT」のような上記の要素のセレクターから 100% が漏れていることが示されました。INPUT要素に直接「#id」を指定すると、「#id foo bar INPUT」よりも具体性が高いと誤って想定しましたが、ブラウザーはこれについて同意していないと思います。いずれにせよ、それが私の問題の根源になったので、コメントをありがとう。コメントを回答に昇格させる方法があればいいのに...

0 投票する
2 に答える
8384 参照

html - 空のセルに CSS パディング スタイルが適用される Google Chrome のバグ

セル内のテキストに適用する必要があるパディング プロパティがすべての空のセルにも適用されている Google Chrome (Firefox、IE、Netscape、Safari、および Opera は問題ありません) でのみ問題があります。影響を受ける境界セルに特定のスタイルを追加し、さまざまなスタイルを使用することで簡単に解決できますが、それには多くの余分なコードと節約しようとする何かが必要です。CSS が適用されるテーブルの空のセルを通過させる方法はありますか?

それに影響を与えるスタイルです。

編集:コンマは、ここでクラスを入力する際の事故でした(私はパラメーター構文を送信するために使用しています)

0 投票する
1 に答える
5645 参照

asp.net - 順序付けられていないリスト項目 (ul) を並べてフロートする

2 つの子順不同リストを並べて配置したい。それらはクラス名 L および R を持っています

HTML マークアップの関連部分を次に示します。

適用したスタイルシートはこれ

しかし、サイドバイサイドの配置はまったく機能していません。何が間違っている可能性がありますか?え?PS: ええ、リスト項目にフローティング div が表示 されました 「clear:left」はボットに適用できますか?

CSS の専門家にとっては重複投稿かもしれませんが、私はそうではありません。だから我慢してください[:)]

編集注: - 詳細を説明するために、画像の 代替テキスト http://www.yetanothercoder.com/img.jpgを参照してください

0 投票する
2 に答える
10626 参照

javascript - JavaScript で Element StyleSheet スタイルを取得する

要素のスタイルを取得するために、Pro JavaScript Techniquesの John Resig のgetStyle関数を使用しています。

ただし、スタイルが指定されていない場合、このメソッドは要素のデフォルト スタイルを返します。

http://johnboxall.github.com/test/getStyle.html

代替テキスト http://img.skitch.com/20081227-8qhxie51py21yxuq7scy32635a.png

要素のスタイルシートで指定されたスタイルのみを取得することは可能ですか (スタイルが定義されていない場合は null を返します)?

アップデート:

なぜ私はそのような獣が必要なのですか?ユーザーが要素のスタイルを設定できる小さなコンポーネントを作成しています。適用できるスタイルの1つはtext-align-leftです。これにより、ユーザーが要素を中央に配置したかったために中央に配置されているのか、それがデフォルトのスタイルであるために中央に配置されているのかを判断できなくなります。centerrightgetStylecenter

0 投票する
2 に答える
821 参照

css - スタイルシートの Grails NumberFormatException

Grails 1.1 beta2 と JSP ページの使用。JSP には CSS リファレンスが含まれています。

この行が含まれていると、Grails は次のエラーを吐き出します。

スタイルシート タグを削除すると、ページはエラーなしで読み込まれます (CSS はありません)。理由はありますか?

0 投票する
6 に答える
1437 参照

css - プロジェクトで CSS をどのように編成しますか?

(複雑な) Web アプリケーションに取り組んでいるときに感じた最も困難なことの 1 つは、CSS の編成です。複数のプロジェクトで試したさまざまなアプローチを次に示します。

1: Web ページ/モジュールごとに異なるスタイルシートを用意します。

当時、私たちは明らかに Web アプリに慣れていなかったので、このアプローチではスタイル シートが多すぎて、スタイルの繰り返しが多すぎました。アプリケーション全体で一貫性を保つのに苦労しました。

2: 同様の Web ページ間で共有される共通のスタイル シートを用意します。

これは、複雑になりすぎるまではうまくいきました。また、例外が多すぎて、特定のケースに合わせて一般的なスタイルを微調整する必要があることもわかりました。これを誤って行うと、アプリケーションのさまざまな部分に影響を与える可能性があり、ある時点でそれが難しくなります。また、大規模な開発チーム (さまざまなタイム ゾーンにまたがる) と厳しいプロジェクト タイムラインも、私たちの目的には役立ちませんでした。

#2 は機能しますが、それでも、私たちの製品は、私たちが望むほどの UI 品質と一貫性を持っていないことがわかりました。

非常に複雑な Web 2.0 アプリケーションで参照すべき CSS スタイル ガイドラインはありますか。他の人はどのようにスタイルシートを維持していますか?

0 投票する
1 に答える
3198 参照

asp.net - DetailsViewコントロールで[選択した]境界線を削除する

アドレスを形成するいくつかの行を含むDetailsViewコントロールがあります。理想的には、アドレス行を次の2つの行に「マージ」したいのですが、基本的にはそれらの間の境界線を削除します。

asp:TemplateFieldを使用して近似解を作成できると思います(単一の行を使用しますが、seconf(データ)セルで改行します)が、他の手段があるかどうかを確認したいと思います。以前のスタイリングと同じ行(CssClassを使用)。その上、これは他の何よりも学習演習です。

Address2 BoundFieldにクラスを与え、CSSを介して下と上の境界線を削除しようとしましたが、機能しないようです。HTMLを見ると、クラスが1つのセルに割り当てられていますが、このクラスを行全体に適用する必要があると思います。行全体に対処する手段はありません。列または1つのセルのいずれかで、すべての行を処理できます。

助言がありますか?

コードスニペット:

HTML:

CSS:

0 投票する
5 に答える
10030 参照

javascript - Javascriptでメディアタイプをどのように決定しますか?

私は周りを見回しましたが、この質問がまだ尋ねられていません。

ページのメディア タイプ (画面、印刷、ハンドヘルドなど) を判断する Javascript の信頼できる方法は何ですか? への参照を見document.styleSheets[0].mediaたことがありますが、ブラウザのサポートの問題か、何かを理解していないため、これを使用できませんでした。

画面ビューではJavascriptによって何かを非表示にしたいが、印刷ビューでは非表示にしたくないので、私は尋ねています。Prototype を使用して要素のトグル スイッチを実行しているため、メディア依存のスタイルに依存することはできません。Prototype では、非表示 ( display: none) で非表示と宣言されている場合、要素を表示に切り替えることはできません。 -インライン CSS*。要素 ( ) にメディア固有のインライン スタイルを設定しようとしました<div style="@media print { foo: bar; } @media screen { blargh: bfargle; }">が、これはサポートされていません。

スタイルシートを循環して、印刷固有のリンクされたスタイルシートがアクティブかどうかを確認できることはわかっていますが、現在、さまざまなメディア固有のスタイル宣言が 1 つのリンクされたスタイルシートにすべて混在している状況にあります。だからダメ。ええ、スタイルシートをさまざまなメディア タイプに分割することはできますが、最初に、CSS とは完全に独立して、Javascript を使用して DOM からメディア タイプを確実に引き出すことができるかどうかを確認したいと思います。ああ、私は「印刷ビューの要素を非表示にし、Javascript で表示されるかどうかを確認する」というトリックを試しましたが、それは 'それらの要素が見えないという事実にもかかわらず。私がここで話していることの詳細を誰かが知りたい場合は、編集で詳しく説明できます.

*これは私が理解していないことであり、常にイライラしています。それについての洞察を提供できる人なら誰でも、私から大きな支持を得ます.

0 投票する
1 に答える
727 参照

asp.net - 左ボタンを押したままマウスの動きを検出する方法

mousedownイベントが発生したら、javascriptを使用してマウスの位置を検出したいと思います。左ボタンを押していると、onmousemoveイベントが発生していないようです。カーソルが十字のある円に変わります。

私の全体的な目標は、マウスダウンでカーソルの開始位置を検出し、オーバーフローが設定されたdiv内の画像の左上のスタイルを変更することです(一種の偽のパン効果)。

ありがとう

0 投票する
7 に答える
21015 参照

css - CakePHP の CSS ファイル内で URL がどのように処理され、正しい場所を参照するようになっていますか?

CSS ファイルを頻繁に使用して Web サイトをデザインしていますが、背景画像、リスト内の箇条書きの画像がいくつかあり、おそらく cssurl()関数の別の必要性が見つかるでしょう。

しかし、cake では、すべての URL をRoute::url()関数で処理する必要があります。いくつかの方法で、最も一般的なのは$html->url()

しかし、私の問題は、CSS ファイルが PHP によって解釈されないことです。次のようなものを含む CSS ファイルを作成する方法:

私の最後のオプションは、css ファイルをレイアウト上にインラインでインポートして、解釈できるようにすることです。しかし、私はより「ケーキ」なアプローチを使用することを強く好みます。

ありがとう!