タグ付けされた質問 「aspect-ratio」

25
CSSでdivのアスペクト比を維持する
作りたい divウィンドウの幅の変化に応じて幅/高さを変更できるます。 アスペクト比を維持しながら、幅に応じて高さを変更できるCSS3ルールはありますか? JavaScriptを使用してこれを実行できることはわかっていますが、CSSのみを使用したいと思います。

21
CSSは画像のサイズを変更し、アスペクト比を維持します
画像を使用していて、アスペクト比の問題に遭遇しました。 <img src="big_image.jpg" width="900" height="600" alt="" /> あなたが見ることができるとして、height及びwidth既に指定されています。画像のCSSルールを追加しました: img { max-width:500px; } しかし、のためにbig_image.jpg、私が受け取るwidth=500とheight=600。縦横比を維持したまま画像のサイズを変更する方法
577 css  image  aspect-ratio 

4
レスポンシブスクエアのグリッド
StackаэтотвопросестьответынаStack Overflowнарусском:Сеткаизадаптивных(sensitive)квадратов レスポンシブな正方形のレイアウトを作成するにはどうすればよいのでしょうか。各正方形には、垂直方向と水平方向に配置されたコンテンツがあります。具体的な例を以下に示します...

11
Androidカメラプレビューストレッチ
Androidでカスタムカメラアクティビティの作成に取り組んでいますが、カメラを回転させると、サーフェスビューのアスペクト比がめちゃくちゃになります。 アクティビティのoncreateで、カメラのパラメーターを表示するサーフェスビューを保持するframelayoutを設定しました。 //FrameLayout that will hold the camera preview FrameLayout previewHolder = (FrameLayout) findViewById(R.id.camerapreview); //Setting camera's preview size to the best preview size Size optimalSize = null; camera = getCameraInstance(); double aspectRatio = 0; if(camera != null){ //Setting the camera's aspect ratio Camera.Parameters parameters = camera.getParameters(); List<Size> sizes = parameters.getSupportedPreviewSizes(); …

18
アスペクト比と幅を維持してUIImageのサイズを変更します
アスペクト比を維持して画像のサイズを変更するための投稿をたくさん見ました。これらの関数は、サイズ変更中にRECTの固定点(幅と高さ)を使用します。しかし、私のプロジェクトでは、幅のみに基づいてビューのサイズを変更する必要があります。高さは、アスペクト比に基づいて自動的に取得されます。誰でも私がこれを達成するのを助けます。

9
divのアスペクト比を維持しながら、CSSで画面の幅と高さを塗りつぶしますか?
16:9ビデオのように、ほぼ横長に固定されたアスペクト比を持つ、まとめるサイトがあります。 利用可能な幅と利用可能な高さを満たすために、それを中央に配置して拡大させたいですが、どちらの側でも大きくなることはありません。 例えば: 縦長の薄いページでは、高さを維持しながらコンテンツを全幅に拡大します。 短い幅のページでは、コンテンツが高さいっぱいに広がり、幅が比例します。 私が見てきた2つの方法があります。 正しいアスペクト比の画像を使用してコンテナを拡張divしますが、主要なブラウザ間で同じように動作させることができませんでした。 比例した下パディングを設定しますが、これは幅に対して相対的にのみ機能し、高さは無視します。幅が広くなるにつれて、垂直スクロールバーが表示されます。 私はあなたがJSでこれを非常に簡単に行うことができることを知っています、しかし私は純粋なCSSソリューションが欲しいです。 何か案は?

7
すべてのAndroidベースの携帯電話とタブレットの画面解像度のリストはありますか?[閉まっている]
閉まっている。この質問はスタックオーバーフローのガイドラインを満たしていません。現在、回答を受け付けていません。 この質問を改善してみませんか?Stack Overflowのトピックとなるように質問を更新します。 2年前休業。 この質問を改善する そうでない場合、最も人気のあるAndroidの携帯電話とタブレットの画面解像度のリストはありますか?

1
SVG画像をブラウザウィンドウいっぱいに拡大縮小する方法は?
簡単なはずですが、なかなか手に入れません。 スクロールせずに、アスペクト比を維持しながら、ブラウザウィンドウに合わせて自動的に拡大縮小する単一のSVG画像を含むHTMLページを作成したいと考えています。 たとえば、現時点では1024x768のSVG画像があります。ブラウザのビューポートが1980x1000の場合、画像を1333x1000で表示します(垂直方向に塗りつぶし、水平方向に中央揃えにします)。ブラウザが800x1000だった場合、800x600で表示したいと思います(水平方向に塗りつぶし、垂直方向に中央揃えにします)。 現在、私はそれを次のように定義しています: <body style="height: 100%"> <div id="content" style="width: 100%; height: 100%"> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100%" viewBox="0 0 1024 768" preserveAspectRatio="xMidYMid meet"> ... </svg> </div> </body> ただし、これはブラウザーの全幅に拡大し(幅が広く短いウィンドウの場合)、垂直スクロールを生成します。これは私が望んでいることではありません。 何が欠けていますか?

7
matplotlib(等しい単位長):「等しい」アスペクト比の場合、z軸はx-およびy-と等しくありません
3Dグラフに等しいアスペクト比を設定すると、z軸が「等しい」に変更されません。したがって、この: fig = pylab.figure() mesFig = fig.gca(projection='3d', adjustable='box') mesFig.axis('equal') mesFig.plot(xC, yC, zC, 'r.') mesFig.plot(xO, yO, zO, 'b.') pyplot.show() 私に次を与えます: ここで、明らかにz軸の単位の長さはx単位とy単位に等しくありません。 3つの軸すべての単位長さを等しくするにはどうすればよいですか?私が見つけたすべての解決策はうまくいきませんでした。ありがとうございました。


7
libGDXでさまざまなアスペクト比を処理する方法は?
ScreenlibGDXフレームワークによって提供されるクラスを明らかに使用するlibGDXを使用していくつかの画面を実装しました。ただし、これらの画面の実装は、事前定義された画面サイズでのみ機能します。たとえば、スプライトが640 x 480サイズの画面(アスペクト比4:3)を対象としている場合、スプライトは画面の境界を超えて画面サイズに合わせて調整されないため、他の画面サイズでは意図したとおりに機能しません。まったく。さらに、libGDXによって単純なスケーリングが提供された場合、ゲーム画面のアスペクト比が変化するため、私が直面している問題は依然として存在していました。 インターネットで調べた後、同じ問題について話し合っているブログ/フォーラムに出くわしました。私はそれを実装しました、そして今のところそれはうまく働いています。しかし、これがこれを達成するための最良の選択肢であるかどうか、またはより良い代替案があるかどうかを確認したいと思います。以下は、私がこの正当な問題にどのように対処しているかを示すコードです。 フォーラムリンク:http://www.java-gaming.org/index.php ? topic = 25685.new public class SplashScreen implements Screen { // Aspect Ratio maintenance private static final int VIRTUAL_WIDTH = 640; private static final int VIRTUAL_HEIGHT = 480; private static final float ASPECT_RATIO = (float) VIRTUAL_WIDTH / (float) VIRTUAL_HEIGHT; private Camera camera; private Rectangle viewport; …

2
SVGサークルはCSSグリッドの高さに重なり合うことなく適応する必要があります
次の例では、円はグリッドの幅に適応し、アスペクト比を維持しています。コンテナの幅が縮小すると、円もそれに伴って縮小します... ただし、高さが幅よりも小さい場合(2番目のボックス)、円はグリッドの外側のオーバーラップを縮小しません。代わりに、アスペクト比を維持しながら高さにも適応させる方法はありますか? .container { display: grid; background-color: greenyellow; margin: 5px; min-height: 10px; min-width: 10px; } .portrait { max-height: 100px; max-width: 200px; } .landscape { max-height: 200px; max-width: 100px; } .aspect-ratio { grid-column: 1; grid-row: 1; background-color: deeppink; border-radius: 50%; align-self: center; justify-self: center; } <div class="container landscape"> <svg class="aspect-ratio" viewBox="0 …
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.