1

css ファイル内の 2 つの div の差を計算することは可能ですか? 目標は、コンテンツ div の高さを、固定ヘッダーとフッターの間に指定された最大高さに設定することです。たとえば、高さが 25% のヘッダー div と高さが 15% のフッターが両方とも固定されています。コンテンツの間のスペースは常に完全に埋める必要があります。したがって、クライアントのディスプレイで設定されている解像度に応じてギャップが変化するため、次のようなものが必要です。

min-height = browserheight - (headerheight + footerheight)

さよなら...

4

2 に答える 2

0

純粋なCSSでは不可能です。ただし、LESS/SASSを試すことはできます。純粋なcssにコンパイルされるのはcssのような言語です。

http://lesscss.org/

@containerWidth : 1000px;
@contentWidth   : 800px;

.side {
   width : @containerWidth-@contentWidth;
}

しかし、値を使用すると、ブラウザーから取得することはより困難になります。

たとえば、ブラウザの幅やブラウザの高さ。この値は、JavaScriptを実行することでLESSで取得できます（LESSで可能です）。ただし、スタイルとして.lessファイルを添付し、<script>タグでjavascriptコンパイラを使用する場合にのみ、スタイルは機能します。これは、ページが読み込まれるときに、lessスタイル（cssスタイル）から作成されます。しかし、それは遅いです。

LESSを使用するより良い方法は、.lessファイルのコードを編集し、それを.cssにコンパイルして、純粋なcssスタイルをWebサイトに挿入することです。ただし、サーバー側でスタイルをコンパイルすると、ブラウザーの高さまたは幅を取得できません。

于 2012-05-21T15:11:16.370 に答える
0

CSS は現在、計算値をサポートしていません。

これを行うパイプラインには、実験的な新しい CSS 機能がいくつかあります。これらは現在、標準化プロセスを経て、Chrome、Firefox などのベータ版に表示され始めたばかりです。今すぐ実験を開始できますが、実際のサイトで使用できる十分な実際のブラウザー サポートが提供されるまでには、長い時間がかかります。

それまでの間、CSS Calc() 機能について詳しく知りたい場合は、Mozilla Developer's siteをご覧ください。

古いバージョンの Internet Explorer には と呼ばれる機能がCSS Expressionsあり、これも概念が非常に似ていました。ただし、標準化されることはなく、サポートされなくなりました。

したがって、今日のように、標準の CSS はこの種のことをサポートしていません。

代替手段は、 LESSやSASSなどの CSS プリプロセッサを使用することです。これらのプログラムは両方とも、純粋な CSS ソリューションがない場合に、プログラミングのような機能を使用して CSS 構文を拡張しようとする試みです。SASS または LESS 構文を使用して CSS を作成し、サイトにアップロードする前に標準の CSS に変換します。

これらはあなたが探しているものを提供するかもしれませんが、最終結果は依然として標準の CSS であるため、それらを使用して動的な計算を行うことはできません.

それが役立つことを願っています。

于 2012-05-21T20:38:30.790 に答える