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 台とスレーブ複数台)
推薦する
Hyper-V の紹介とインストールと使用 (詳細な図解)
はじめに：IT 業界の巨人である Microsoft 独自の仮想化技術は、VMware や Citr...
Reactエラー境界コンポーネント処理
React 16の内容です。最新技術ではありませんが、ドキュメントで調べるまであまり話題に上がらなか...
MySQL の列から行への変換と年月グループ化の例
以下のように表示されます。 SELECT count(DISTINCT(a.rect_id)) zc...
Vuexはシンプルなショッピングカートを実装します
この記事では、参考までに、Vuex の具体的なコードを共有して、簡単なショッピングカートを実装します...
実行中の Docker コンテナにボリュームを動的に追加する方法
以前、Docker コンテナの起動後にボリュームをマウントできるかどうか尋ねられたことがあります。m...
Vue.js プロジェクトの開始方法
目次1. Node.jsとVue 2. ローカル開発環境でフロントエンドのVueプロジェクトを実行す...
JavaScript の基礎: スコープ
目次範囲グローバルスコープ関数のスコープもし、スイッチ、のために、その間ブロックスコープスコープチェ...
JavaScript キャンバスで 9 マスのグリッドカットの効果を実現
この記事では、9グリッドカット効果を実現するためのキャンバスの具体的なコードを紹介します。具体的な内...
Docker Toolboxを完全にアンインストールする方法
Docker Toolbox は、Windows 10 Professional より前のバージョン...
Tomcat イメージをインストールして Docker に Web プロジェクトをデプロイする方法を簡単に説明します。
1. Tomcatをインストールする1. Docker HubでTomcatイメージを見つける d...
JavaベースのMySQLバックアップテーブル操作
コアはmysqldumpとランタイムです操作は実際にはそれほど難しくありません。バックアップ操作を実...
MySQLのkillがスレッドをkillできない理由
目次背景問題の説明原因分析シミュレーションする総括する背景日常の使用において、MySQL で個別また...
Vue3 を使用してアップロード コンポーネントを実装するためのサンプル コード
目次一般的なアップロードコンポーネントの開発以下の機能を実装する必要がありますカスタムテンプレートサ...
フレックスレイアウトの justify-content: space-between 配置のバグを解決する 2 つの方法の詳細な説明
display:flex、justify-content: space-betweend を設定する...
JavaScript Three.js でテキストを作成する最初の経験
目次効果テキストの作成を開始するまずフォントローダーを作成するフォントライブラリを読み込むテキストジ...