DWボタンの設定方法は？ DW にバナー ボタン インスタンスを追加する

今回は、DWにバナーボタンを追加する方法と、DWにバナーボタンを追加する際の注意点を説明します。以下は実際のケースです。

1. 写真のようにバナー素材を準備し、img画像ライブラリに置きます

2. Dreamweaverソフトウェアを開き、ctrl+n新しいhtmlファイルを作成して保存します

3.本文内 コンテンツボックスにコンテンツを作成し、クラス名を設定します

<p class="banner">
<img src="img/banner.jpg" >
<input type="button" value="左"  class="bt_left">
    <input type="button" value="右" class="bt_right">
</p>

大きなボックスに画像と2方向キーを入れて、最後に左右を左右の位置に配置します

4. ヘッドの下にstyleタグを追加してバナーを調整します。幅と高さの属性値を設定します:

<style>
.banner{width:1200px;height:300px;margin:0 auto;overflow:hidden;}
.banner img{width:100%;}
</style>

5. 大きなフレームのバナーを相対配置に設定し、左ボタンを絶対配置に設定し、位置を設定します

.bt_left{position:absolute;top:50%;left:20px; }

6. 右ボタンの絶対位置を設定し、位置を設定します

.bt_right{position:absolute;top: 50%;right:20px;}

この事例を読んだことがあるかと思いますが、この方法をマスターした後は、よりエキサイティングなコンテンツについては、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

フロントエンドの実践的なプロジェクトで CSS コードを使用する際に注意すべき 20 の事項

文字列をインターセプトするには純粋な CSS3 を使用してください

以上がDWボタンの設定方法は？ DW にバナー ボタン インスタンスを追加するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。