写真内の画像のアスペクト比

次のようなタイトルの画像があります。 タイトル CSS には img{max-width:100%} もあります。画像の幅と高さを同時に設定し、幅が設定値を下回った場合でもそのアスペクト比を維持したいと考えています。それで、私は次のようなコードを試しました： タイトル これはほぼ私が望むものですが、画像が「レターボックス化」されている場合、タイトルは画像の下部からかなり離れています。タイトルを画像の下部にぴったりと合わせたまま、希望の結果を得る方法はありますか?

P粉557957970 2023-08-17 20:24:04 0  1  474

html5 - 画像のアスペクト比を携帯端末の現在の画面の全画面サイズに正確に合わせるにはどうすればよいですか?

1. 携帯端末で画像のアスペクト比を携帯電話の全画面サイズに調整するにはどうすればよいですか? 幅が 100% の場合は高さも適応する必要があり、高さが 100% の場合は幅も適応する必要があります。このようにすると、画像が現在の画面を超えてスクロール バーが表示される場合があります。スライドして表示しないと空白ができてしまいます...

世界只因有你 2017-05-16 13:25:15 0  5  1077

テーブルの配置には配置のみが含まれ、サイズ、長さ、幅、背景色は含まれません。

テーブルの配置には配置のみが含まれ、サイズ、長さ、幅、背景色は含まれません。

古。。 2019-01-18 14:42:28 0  2  1074

複数のSVGファイルを同じ比率で拡大する

私には 100 近くの SVG ファイルのコレクションがあり、すべて美しく手作業でコーディングされており、それぞれの viewBox、幅、高さが慎重に指定されています。これらの SVG ファイルは、幅、高さ、アスペクト比が異なります。厄介な問題があります。私はそれらの相対的なサイズを気にしており、保存したいと考えています。 HTML ページでは、「自然な」サイズ、つまり幅と高さで指定されたサイズで表示したいと考えています。非常にシンプルです: <imgsrc="….svg">。 CSS で {object-fit:n を指定する必要があるかもしれません。

P粉244730625 2024-01-10 17:27:19 0  1  469

MUI チップ: オーバーフロー/省略記号を無効にする方法は?

React で MUI を使用する場合、Chip コンポーネント内のラベルに基づいて、Chip コンポーネントの幅を柔軟に設定したいと考えています。たとえば、長いラベルの場合、チップの幅を広くする必要があります。ラベルが短い場合は、チップの幅を小さくすることもできます。つまり、ラベル全体が切り詰められることなくチップ内に表示される必要があります。

P粉864594965 2023-07-27 18:00:52 0  1  660

CSS は他のテクニックを使わずに水平ボタンを実装します

最も長いボタンの幅に基づいて、同じ幅の 2 つの水平ボタンを作成しようとしています。各ボタンのテキスト内容は、ユーザーが別のページで調整できるため、テキストの長さ/最初のボタンと 2 番目のボタンのテキストの長さを制御することはできません。ボタンを最長のテキストの長さに合わせて調整しますが、(モバイル デバイスのように) ページの幅を超えないようにしてください。ボタンをデフォルトで水平に表示したいのですが、水平に表示されない場合は、列として積み重ねます。テキスト全体が収まらない場合は、ボタンのテキストを折り返す必要があります。 <divclass=&qu

P粉893457026 2023-09-04 12:29:02 0  1  563

node.js - より優れたノード アーキテクチャのサンプル コードはありますか?

ノードを初めて使用するのですが、より良いサンプル コードはありますか?

天蓬老师 2017-05-16 13:33:41 0  2  563

javascript - 以下の例に示すように、img 要素を div 内で中央に配置する方法

HTML コード {code...} 目的の効果の例。 赤い部分が div で、緑の部分が img です。つまり、img の幅は固定されていないため、これを解決することはできません。マージン左を固定します。

给我你的怀抱 2017-05-16 13:21:39 0  13  1733

JavaScript を使用して画像の比率を制限する

<inputtype="file"id="file"accept="image/gif,image/jpeg,image/png">HTML コードの構造は次のとおりです。この場合、入力に1:1の比率の画像が存在しない場合、JavaScript経由で別のページに移動したいと考えています。

P粉111927962 2024-02-17 20:13:49 0  1  450

コンテンツの幅に合わせてテキスト領域のサイズを変更し、最小幅と最大幅を設定するにはどうすればよいですか?

それで、私は今テキストエリアで問題を抱えています、コンテンツの幅に合わせてサイズを変更できません...コンテンツの高さに関する長くて詳細な答えを見つけました、そしてそれはうまくいきます！しかし、上にはコンテンツの幅がありません...これがその記事です: 自動サイズ変更を使用してテキストエリアを作成する しかし、私の問題は解決されていないため、幅もサイズ変更する必要があります。最大幅と最小幅を考慮してください。サンプル コードは次のとおりです: $("textarea").each(function(){this.setAttribute("s

P粉277824378 2023-09-05 11:21:30 0  1  571

JavaScript - キャンバス圧縮画像の最大圧縮率はどれくらいですか?

最近のプロジェクトでは、画像が圧縮されてアップロードされ、画像の圧縮に Canvas が使用されました。 Canvas では、画像ごとに最小圧縮率が異なることがわかりました。最大の 22M 画像の場合、最小のものは約 900k までしか圧縮できず、圧縮率は 0.036 です。そして、写真のうちの 1 枚 (わずか約 900k...)

大家讲道理 2017-06-12 09:28:20 0  1  936

CSS: テキストの横にアイコンを配置するにはどうすればよいですか?

このような親 div 要素 (display:flex) があり、テキスト - スパン要素 (i) アイコン - div 要素の 2 つの子要素が含まれています。テキストが 1 行のみ (折り返しなし) の場合は、すべて正常に機能します。ただし、折り返す場合（2行以上）、要素の幅は最も太い行に基づいて調整されるため、長さが長い場合はテキストを折り返すようにしたいと考えています。上の例では、(i) アイコンを NORTH の隣に置きたいと思います。 (i)のアイコンをNORTHの横に置きたいです。

P粉668146636 2023-08-17 14:39:36 0  1  465

javascript - 幅が設定されていないインライン要素の正確な幅を取得するにはどうすればよいですか?

例: td には幅が設定されていますが、span には幅が設定されていません。 1. $.width() を使用して整数の幅を取得し、 $('td').width() を使用して 218px を取得し、スパンは 129px2. clientWidth を使用してマージンとボーダーなしの幅を取得し、スパン幅は 0 です。 TD幅は'218'3です...

PHP中文网 2017-05-19 10:46:37 0  3  824

JavaScript - モバイルデバイスで再生するビデオに通常どのような幅、高さ、品質を使用していますか?

ビデオ ソース ファイルは 1080p、3000 kbps を超えるビデオで、長さは約 4 分です。 PC側では720p、1000kbpsに圧縮して30Mくらいのサイズです。ただ、モバイル端末に載せるとなると、まだ少しサイズが大きい気がするのですが、どうやって圧縮するか迷っています。幅、高さ、ビットレートなど。プレス...

大家讲道理 2017-06-12 09:25:10 0  1  793

セルに表示される疑似「中央」配置で表内の数値の小数点を配置します。

小数点の前後の長さが異なり、小数点がすべて揃っている、10 進数の列を含むテーブルが必要です。列幅は「フロー」サイズである必要があり、データ セル内の非常に長い数値や列に関連付けられた非常に長いヘッダーを収容するために必要に応じて拡張されます。整数 (小数点なし) を含むセルには、小数点文字が存在するかのように同じ位置に整列して数値が表示されます。 (たとえば、数字 512 は、「512」ではなく「512」のみを含むセルと正しく位置合わせされる必要があります。) フォントは重要ではなく、等幅である必要はありません。やっと

P粉373990857 2023-10-24 13:01:47 0  1  742

javascript - [CSS] CSSでimgの高さと幅を等しくすることはできますか？

img 要素: 幅にパーセンテージを使用します。CSS コントロールを使用して実現できますか: どのようなデバイスでも、img の高さは常に幅と同じになります。

習慣沉默 2017-06-28 09:26:36 0  2  896

タイトルが次のように書き換えられました: フレックスボックス メニューとタイトル付きのテーブル - テーブルの幅に基づいてタイトルを切り詰めることは可能ですか?

flexboxCSSを使用してこのようなことを実現したいと考えています。メニューは固定幅ですが、テーブルは自動的に拡大する可能性があり、ヘッダーは長い場合でもテーブルの幅を超えてはなりません。言い換えれば、テーブルは列コンテナーを拡張できる必要がありますが、ヘッダーは拡張できません。 +----+--------+|メニュー|タイトル||+--------+||テーブル|+----+--------+これは 1 つのフレックス列だけで簡単に実現できます。 &lt;html&gt;&lt;スタイル&gt;

P粉642920522 2023-09-06 17:30:06 0  1  408