静的カルーセル
<span style="color: #008080"> 1</span> <span style="color: #800000"><!DOCTYPE html> </span><span style="color: #008080"> 2</span> <span style="color: #800000"><html xmlns="http://www.w3.org/1999/xhtml"> </span><span style="color: #008080"> 3</span> <span style="color: #800000"><head> </span><span style="color: #008080"> 4</span> <span style="color: #800000"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> </span><span style="color: #008080"> 5</span> <span style="color: #800000"><title></title> </span><span style="color: #008080"> 6</span> <span style="color: #800000"><link href="css/demo.css" rel="stylesheet" /> </span><span style="color: #008080"> 7</span> <span style="color: #800000"></head> </span><span style="color: #008080"> 8</span> <span style="color: #800000"><body> </span><span style="color: #008080"> 9</span> <span style="color: #800000"><div id="dlunbo"> </span><span style="color: #008080">10</span> <span style="color: #800000"><div id="igs"> </span><span style="color: #008080">11</span> <span style="color: #800000"><div class="ig"><img src="img/1_1.jpg" /></div> </span><span style="color: #008080">12</span> <span style="color: #800000"><div class="ig"><img src="img/1_2.jpg" /></div> </span><span style="color: #008080">13</span> <span style="color: #800000"><div class="ig"><img src="img/1_3.png" /></div> </span><span style="color: #008080">14</span> <span style="color: #800000"><div class="ig"><img src="img/1_4.jpg" /></div> </span><span style="color: #008080">15</span> <span style="color: #800000"><div class="ig"><img src="img/1_5.jpg" /></div> </span><span style="color: #008080">16</span> <span style="color: #800000"></div> </span><span style="color: #008080">17</span> <span style="color: #800000"><ul id="tabs"> </span><span style="color: #008080">18</span> <span style="color: #800000"><li class="tab"></li> </span><span style="color: #008080">19</span> <span style="color: #800000"><li class="tab"></li> </span><span style="color: #008080">20</span> <span style="color: #800000"><li class="tab"></li> </span><span style="color: #008080">21</span> <span style="color: #800000"><li class="tab"></li> </span><span style="color: #008080">22</span> <span style="color: #800000"><li class="tab"></li> </span><span style="color: #008080">23</span> <span style="color: #800000"></ul> </span><span style="color: #008080">24</span> <span style="color: #800000"><div class="btn btn1" ><</div> </span><span style="color: #008080">25</span> <span style="color: #800000"><div class="btn btn2">></div> </span><span style="color: #008080">26</span> <span style="color: #800000"></div> </span><span style="color: #008080">27</span> <span style="color: #800000"></body> </span><span style="color: #008080">28</span> <span style="color: #800000"></html><br></span>
<span style="color: #008080"> 1</span> <span style="color: #800000">*</span>{
<span style="color: #008080"> 2</span> <span style="color: #ff0000">margin</span>:<span style="color: #0000ff">0px</span>;
<span style="color: #008080"> 3</span> <span style="color: #ff0000">padding</span>:<span style="color: #0000ff">0px</span>;
<span style="color: #008080"> 4</span> <span style="color: #ff0000">list-style-type</span>:<span style="color: #0000ff">none</span>;
<span style="color: #008080"> 5</span> }
<span style="color: #008080"> 6</span> <span style="color: #800000">#dlunbo</span>{
<span style="color: #008080"> 7</span> <span style="color: #ff0000">width</span>:<span style="color: #0000ff">500px</span>;
<span style="color: #008080"> 8</span> <span style="color: #ff0000">height</span>:<span style="color: #0000ff">330px</span>;
<span style="color: #008080"> 9</span> <span style="color: #ff0000">position</span>:<span style="color: #0000ff">absolute</span>;
<span style="color: #008080">10</span> <span style="color: #ff0000">top</span>:<span style="color: #0000ff">50%</span>;
<span style="color: #008080">11</span> <span style="color: #ff0000">margin-top</span>:<span style="color: #0000ff">-166px</span>;
<span style="color: #008080">12</span> <span style="color: #ff0000">left</span>:<span style="color: #0000ff">50%</span>;
<span style="color: #008080">13</span> <span style="color: #ff0000">margin-left</span>:<span style="color: #0000ff">-250px</span>;
<span style="color: #008080">14</span> }
<span style="color: #008080">15</span> <span style="color: #800000">.ig</span>{
<span style="color: #008080">16</span> <span style="color: #ff0000">position</span>:<span style="color: #0000ff">absolute</span>;
<span style="color: #008080">17</span> }
<span style="color: #008080">18</span> <span style="color: #800000">img</span>{
<span style="color: #008080">19</span> <span style="color: #ff0000">width</span>:<span style="color: #0000ff">500px</span>;
<span style="color: #008080">20</span> <span style="color: #ff0000">height</span>:<span style="color: #0000ff">330px</span>;
<span style="color: #008080">21</span> }
<span style="color: #008080">22</span> <span style="color: #800000">#tabs</span>{
<span style="color: #008080">23</span> <span style="color: #ff0000">position</span>:<span style="color: #0000ff">absolute</span>;
<span style="color: #008080">24</span> <span style="color: #ff0000">top</span>:<span style="color: #0000ff">300px</span>;
<span style="color: #008080">25</span> <span style="color: #ff0000">left</span>:<span style="color: #0000ff">200px</span>;
<span style="color: #008080">26</span> }
<span style="color: #008080">27</span> <span style="color: #800000">.tab</span>{
<span style="color: #008080">28</span> <span style="color: #ff0000">width</span>:<span style="color: #0000ff">20px</span>;
<span style="color: #008080">29</span> <span style="color: #ff0000">height</span>:<span style="color: #0000ff">20px</span>;
<span style="color: #008080">30</span> <span style="color: #ff0000">border</span>:<span style="color: #0000ff">solid 1px #ffffff</span>;
<span style="color: #008080">31</span> <span style="color: #ff0000">float</span>:<span style="color: #0000ff">left</span>;
<span style="color: #008080">32</span> <span style="color: #ff0000">margin-left</span>:<span style="color: #0000ff">5px</span>;
<span style="color: #008080">33</span> <span style="color: #ff0000">border-radius</span>:<span style="color: #0000ff">100%</span>;
<span style="color: #008080">34</span> <span style="color: #ff0000">cursor</span>:<span style="color: #0000ff">pointer</span>;
<span style="color: #008080">35</span> }
<span style="color: #008080">36</span> <span style="color: #800000">.btn</span>{
<span style="color: #008080">37</span> <span style="color: #ff0000">width</span>:<span style="color: #0000ff">30px</span>;
<span style="color: #008080">38</span> <span style="color: #ff0000">height</span>:<span style="color: #0000ff">50px</span>;
<span style="color: #008080">39</span> <span style="color: #ff0000">position</span>:<span style="color: #0000ff">absolute</span>;
<span style="color: #008080">40</span> <span style="color: #ff0000">background</span>:<span style="color: #0000ff">rgba(0,0,0,0.5)</span>;
<span style="color: #008080">41</span> <span style="color: #ff0000">color</span>:<span style="color: #0000ff">#fff</span>;
<span style="color: #008080">42</span> <span style="color: #ff0000">text-align</span>:<span style="color: #0000ff">center</span>;
<span style="color: #008080">43</span> <span style="color: #ff0000">line-height</span>:<span style="color: #0000ff">50px</span>;
<span style="color: #008080">44</span> <span style="color: #ff0000">font-size</span>:<span style="color: #0000ff">30px</span>;
<span style="color: #008080">45</span> <span style="color: #ff0000">top</span>:<span style="color: #0000ff">50%</span>;
<span style="color: #008080">46</span> <span style="color: #ff0000">margin-top</span>:<span style="color: #0000ff">-25px</span>;
<span style="color: #008080">47</span> <span style="color: #ff0000">cursor</span>:<span style="color: #0000ff">pointer</span>;
<span style="color: #008080">48</span> }
<span style="color: #008080">49</span> <span style="color: #800000">.btn1</span>{
<span style="color: #008080">50</span> <span style="color: #ff0000">left</span>:<span style="color: #0000ff">0px</span>;
<span style="color: #008080">51</span> }
<span style="color: #008080">52</span> <span style="color: #800000">.btn2</span>{
<span style="color: #008080">53</span> <span style="color: #ff0000">right</span>:<span style="color: #0000ff">0px</span>;
<span style="color: #008080">54</span> }
以上が静的カルーセルの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。
人気の記事
ホットツール
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
ドリームウィーバー CS6
ビジュアル Web 開発ツール
SublimeText3 Mac版
神レベルのコード編集ソフト（SublimeText3）
ホットトピック
7760
15
1644
14
1399
52
1293
25
1234
29
C 言語における static キーワードの役割と使用法の詳細な分析
Feb 20, 2024 pm 04:30 PM
C 言語における static キーワードの役割と使用法の詳細な分析 C 言語では、static は関数、変数、データ型の定義に使用できる非常に重要なキーワードです。 static キーワードを使用すると、オブジェクトのリンク属性、スコープ、ライフサイクルが変更される可能性があるため、C 言語における static キーワードの役割と使用法を詳しく分析してみましょう。静的変数と関数: 関数内で static キーワードを使用して定義された変数は静的変数と呼ばれ、グローバルなライフサイクルを持ちます。
PHP におけるプライベート静的メソッドの役割と適用シナリオ
Mar 23, 2024 am 10:18 AM
PHP におけるプライベート静的メソッドの役割と適用シナリオ PHP プログラミングにおいて、プライベート静的メソッドは特殊なメソッド タイプであり、定義されたクラス内でのみアクセスでき、外部から直接呼び出すことはできません。プライベート静的メソッドは通常、クラスの内部ロジックの実装に使用され、詳細をカプセル化して非表示にする方法を提供します。同時に、静的メソッドの特性を備えており、クラス オブジェクトをインスタンス化せずに呼び出すことができます。以下では、プライベート静的メソッドの役割とアプリケーション シナリオについて説明し、具体的なコード例を示します。機能: 実装の詳細をカプセル化して非表示にする: private static
静的相対位置決めのテクニックと方法を素早く習得します。
Jan 18, 2024 am 11:18 AM
高速静的相対位置決めは、Web 開発において非常に重要な位置決め方法です。これにより、ドキュメント フロー内での位置を維持しながら、要素を通常の位置に対してわずかに調整できます。この記事では、高速静的相対位置決めの使用方法と、いくつかの一般的なアプリケーション シナリオを詳しく紹介します。まず、高速静的相対位置決めの基本概念を理解する必要があります。 CSS では、要素を配置する方法として、静的配置、相対配置、絶対配置、固定配置の 4 つの方法があります。静的配置はデフォルトの配置方法であり、要素の位置はドキュメントによって決まります。
静的再配置技術の原理と応用事例
Jan 18, 2024 am 11:12 AM
静的再配置テクノロジの原理と応用 はじめに: 最新のコンピュータ システムでは、メモリ管理は非常に重要なトピックです。ソフトウェアの複雑さとサイズが増大するにつれて、メモリの制約が課題になります。メモリ リソースをより効率的に利用するために、静的再配置テクノロジが登場しました。この記事では、静的再配置テクノロジの原理とアプリケーションを紹介し、いくつかの具体的なコード例を示します。 1. 静的再配置技術の原理 静的再配置とは、プログラムコードやデータをある論理アドレス空間から別の論理アドレス空間に移動する手法です。
ページ レイアウト方法の最適化: 高速静的相対位置決めの応用スキル
Jan 18, 2024 am 10:39 AM
高速静的相対位置決めを使用してページ レイアウトを最適化する方法 インターネットの発展に伴い、Web デザインの重要性がますます高まっています。適切なページ レイアウトはユーザー エクスペリエンスを向上させ、Web サイトの使いやすさとアクセシビリティを向上させます。高速静的相対配置は、ページ レイアウトを効果的に最適化できる一般的に使用されるレイアウト手法です。この記事では、高速な静的相対配置を使用してページ レイアウトを最適化する方法を紹介します。高速静的相対配置はCSSをベースとしたレイアウト技術で、CSSスタイルシートの「position」属性を利用することで、テキストに影響を与えることなく利用できます。
Go 言語機能の詳細な説明: Go 言語機能について 1 つの記事で学べます
Mar 05, 2024 am 09:54 AM
Go 言語の機能の詳細な説明: Go の言語機能について 1 つの記事で説明します。Go 言語は、Google によって開発されたオープンソース プログラミング言語であり、静的に型付けされ、コンパイルされ、同時実行され、ガベージ コレクション機能を備えています。 Go 言語は 2009 年のリリース以来、効率的な同時処理機能、簡潔な構文、および高速なコンパイル速度によりプログラマーに愛されてきました。この記事では、Go 言語の主な機能のいくつかを詳細に紹介し、特定のコード例を通じて読者がこれらの機能をよりよく理解できるようにします。同時プログラミング Go 言語の最大の特徴の 1 つは、ネイティブであることです。
Golang の独自の機能と利点を理解する
Mar 03, 2024 am 10:51 AM
Golang (Go 言語) は、Google によって開発されたプログラミング言語であり、当初から開発者に愛されてきました。 Golang には、大規模な同時プログラム、ネットワーク プログラミング、クラウド コンピューティングなどの分野で優れたパフォーマンスを発揮できる独自の設計概念と利点があります。この記事では、Golang の独自の機能と利点を探り、特定のコード例を通じてこれらの機能を示します。 1. 同時プログラミング Golang は当然ながら同時プログラミングをサポートしており、ゴルーチンとチャネルの 2 つの主要な機能を通じて、開発者は簡単に同時プログラミングをサポートしています。
エラー プロンプトを回避するために静的 jQuery を Vue に導入する
Feb 19, 2024 pm 04:16 PM
Vue プロジェクトに静的 jQuery を導入すると、エラー メッセージが表示されることがあります。主な理由は、Vue には jQuery の導入と使用に関して特別な要件があるためです。実際の開発では、これらのエラー プロンプトの表示を回避するために、いくつかの仕様と注意事項に従う必要があります。以下に、読者がこうした間違いを避けるのに役立つ具体的なコード例と解決策をいくつか紹介します。まず最初に明確にしておきたいのは、Vue 自体が豊富な機能を提供しているため、Vue プロジェクトに jQuery を導入することは推奨されるアプローチではないということです。
