不規則な絵の滝の流れ原理の分析と応用

不規則な絵の滝の流れ原理の分析と応用

プロジェクトで発生した不規則な絵画壁のレイアウト問題は、次のように分析されます。

1.img display: block; 3px img タグのバグを解決する

2. img の高さと幅を設定します。設定しないと、下の画像が表示されます。上の画像が先に読み込まれると、再度読み込まれたときに画像が押し下げられます。

3. 親divの位置: relative; 画像の価格を相対的および絶対的に配置できます

4. 子スパンの位置: absolute; right: 5px; bottom: 5px; 価格を親divに絶対配置します

5. 効果を得るには、画像divを3列のdivに配置します。

効果は以下のとおりです。

コードをコピー
コードは次のとおりです。

<div id=”main”></p> <p> <div class=”g1”></p> <p> <div class=”item”></p> <p> <img src=”” width=”” height=””/></p> <p> <span>価格</span></p> <p> </div></p> <p> …..</p> <p> </div></p> <p> <div class=”g2”></p> <p> </div></p> <p> <div class=”g3”></p> <p> </div></p> <p></div>


<<:  メタ情報に基づいて時間指定のページ更新またはリダイレクトを実装する

>>:  CentOS7 環境での DHCP 設定チュートリアル

推薦する

C# は MySQL コマンドラインのバックアップとリカバリを実装します

MySQL データベースをバックアップするためのツールは多数あります。過去 2 日間で、C# を使用...

MySQL で重複行を見つけて削除する方法

目次1. 重複行を見つける方法2. 重複行を削除する方法3. 複数の列で重複を見つける方法4. クエ...

MySQL Community Server 圧縮パッケージのインストールと設定方法

今日は、MySQL をインストールしたかったので、公式 Web サイトにアクセスして、MySQL の...

Docker の MySQL コンテナのタイムゾーン問題の修正

序文Ahhang が Springboot プロジェクトを開発していたとき、フロントエンドから検証コ...

JavaScript でツリー構造を構築するための効率的なアルゴリズムについての簡単な説明

目次導入アイデアID配列インデックスのマッピング関係を確立するツリー構造の構築原理要約する導入組織階...

ReactにおけるuseRefの具体的な使い方

React の経験がある人なら、コンポーネントインスタンスオブジェクトや DOM オブジェクトを取得...

MySQL の重複データの処理方法 (防止と削除)

一部の MySQL テーブルには重複レコードが含まれている場合があります。重複データが存在することを...

レム適応の一般的なパッケージ3つについて

序文以前、rem適応についての記事を書きましたが、具体的なパッケージは紹介しませんでした。今日は、よ...

Reactはラジオコンポーネントのサンプルコードを実装します

この記事の目的は、最も明確な構造を使用していくつかのコンポーネントの基本機能を実装することです。皆さ...

各グループの最新データを取得するためにMySQLベースのグループを実装する

序文:グループ化関数はグループ内の最初のデータを取得しますが、各グループ内の最新のデータを取得する必...

エラー mysql テーブル 'performance_schema...解決方法

テスト環境は、JDBCドライバを使用してMariaDB 5.7でセットアップされています。 <...

Zabbixリモートコマンド実行の詳細な例

目次1つ。環境二。予防三つ。例Zabbix トリガーがしきい値に達すると、アラート メッセージの送信...

ページのキャッシュを防ぐソリューション

解決: <head> に次のコードを追加します。コードをコピーコードは次のとおりです。 ...

Linux でスペースを含むファイルを削除する (ディレクトリではない)

日常業務では、スペースのないファイルに遭遇することがよくあります。これにより、削除操作がはるかに簡単...

ウェブページ上でデスクトップ exe プログラムを呼び出す簡単な方法

この記事では主に、Web ページ上でデスクトップ exe プログラムを呼び出す方法を紹介します。 W...