CSS3 で Taobao に空白スペースを実装する方法
|
Taobao用の空白スペースを作成します。
ブラウザページを縮小すると、コンテンツ領域は縮小されませんが、空白スペースは小さくなります。
<!DOCTYPE html>
<html>
<ヘッド>
<メタ文字セット="utf-8" />
<タイトル></タイトル>
<スタイル タイプ="text/css">
*{
マージン: 0;
パディング: 0;
}
.ラッパー{
高さ: 30px;
背景色: グレー;
}
。コンテンツ{
幅: 1200ピクセル;
高さ: 30px;
背景色: #0f0;
margin: 0 auto;/* 上と下は 0、左と右は適応型*/
}
</スタイル>
</head>
<本文>
<div class="wrapper"><!-- 背景領域 -->
<div class="content"></div><!-- コンテンツ領域 -->
</div>
</本文>
</html>
このように、ズームすると外側の灰色の部分がズームされ、緑色の部分が常に中央になります。 中のテキストはこのように書かれています。 <div> <ul style="float: left;"></ul> <ul style="float: right;"></ul> </div> CSS3 で Taobao のホワイト スペースを実現する方法については、これで終わりです。CSS3 Taobao のホワイト スペースに関する関連コンテンツについては、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 |
<<: Vue コンポーネントでのアンチシェイクとスロットリングの使用例の分析
>>: MySQL 構成マスタースレーブサーバー (マスター 1 台とスレーブ複数台)
推薦する
Docker イメージのローカル Elasticsearch ポート操作へのアクセス
dockerスタックによってデプロイされたイメージサービスを使用すると、イメージを入力した後、理論的...
Vueコンポーネント通信のさまざまな方法の詳細な説明
目次1. 父から息子へ2. 息子から父へ3. 親子関係のないコンポーネントの値の転送4. ヴュークス...
フレックスレイアウトは、上下固定、中間スライドのレイアウトモードを実現します。
この記事では、主に、上下固定と中スライドレイアウトを実現するためのフレックスレイアウトのレイアウト方...
Jenkins Docker 静的エージェント ノードのビルド プロセス
静的ノードはマシン上に固定されており、いくつかの固定コマンドを通じて起動されます。動的ノードには複数...
IDEA2021 tomcat10 サーブレットの新しいバージョンの落とし穴
私が学習していたときに使用していたバージョンは比較的新しいものであり、インターネット上のチュートリア...
Tomcat マルチインスタンスの展開と構成の原則
1. ファイアウォールをオフにし、Tomcatのインストールに必要なソフトウェアパッケージを/opt...
ログインインターフェースの使いやすさとセキュリティのバランスをとる方法
ウェブデザイナーでもUIデザイナーでも、ログインページや登録ページのデザインは必ず経験しなければなら...
docker-maven-pluginはイメージをパッケージ化し、プライベートウェアハウスにアップロードします。
目次1. docker-maven-pluginの紹介2. 環境とソフトウェアの準備3. デモ例3....
MySQLデータベースの共通操作スキルのまとめ
この記事では、MySQL データベースの一般的な操作テクニックをまとめます。ご参考までに、詳細は以下...
Linux ブートシステム方式の分析
この記事では、Linux システムを起動する方法について説明します。ご参考までに、詳細は以下の通りで...
ReactとReduxの配列処理の説明
この記事では、reduce()、filter()、map()、every()、some()、spre...
10 種類のモダンなレイアウトを実現するための CSS コード
序文日曜日に自宅で web.dev の 2020 3 日間ライブを視聴したところ、興味深い点がたくさ...
mysql 10進データ型変換の実装
最近、次のデータ型のデータベースに遭遇しました:decimal(14,4)発生した問題は次のとおりで...
Mysql の 2 つのテーブル間の結合クエリの 4 つの状況の概要
一般的に言えば、より完全な結果を得るためには、2 つ以上のテーブルから結果を取得する必要があります。...
React スキャフォールディングのパスエイリアスを設定する方法
この記事を書いている時点でのReactのバージョンは16.13.1です1 npm run eject...