outbraveのプロフィール
- ベストアンサー数
- 231
- ベストアンサー率
- 60%
- お礼率
- 0%
- 登録日2007/05/01
- コマンドボタンを中央に表示したい
<html> <head> <title>test</title> <style type="text/css"> <!-- div.div_center { margin-left: auto; margin-right: auto; } --> </style> </head> <body> <div class="div_center"> <button type="button" onclick="window.open('http://www.google.co.jp/','_blank');">google</button> </div> </body> </html> なぜこのコードではコマンドボタンは中央に表示されないのでしょうか? margin-left: auto; margin-right: auto; これは違いますか?
- フルスライドの画像上に文字を入れたい
すみません、初心者です。 htmlは、 <div id="container"> <div class="fullSlideShow"> <ul> <li><a href="#1"><img src="img/photo01.jpg" alt=""></a></li> <li><a href="#2"><img src="img/photo02.jpg" alt=""></a></li> <li><a href="#3"><img src="img/photo03.jpg" alt=""></a></li> <li><a href="#4"><img src="img/photo04.jpg" alt=""></a></li> <li><a href="#5"><img src="img/photo05.jpg" alt=""></a></li> <li><a href="#5"><img src="img/photo06.jpg" alt=""></a></li> </ul> </div> <div class="helo"> <h1>site title</h1> <p>abcdefg</p> </div> と書いてみました。CSSですが、 .fullSlideShow h1 { position: absolute; z-index:500; left: 40px; top: 40px; padding-right: 40px; font-size: 2em; line-height: 1.20; } .fullSlideShow h1 a.textlink { color: white; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); text-decoration: none; } としてみましたが表示されません。まだサイズや位置は気にせず表示されるように試してみているのですが、どうも文字が画面上に現れてくれません。 とりあえず、h1とpだけでも表示させたいのですが、教えて頂けないでしょうか。 どうぞ宜しくお願いします。
- ベストアンサー
- CSS
- tomiko1954
- 回答数1
- 画像を一杯に表示できない
PCでもスマホでも画像を幅一杯に表示させたいです。全画面表示ではありません。できればCSSファイルは別途作成せず、1つのHTMLファイルですませたいです。そこで以下のソースを書きましたが、画像x.jpgのサイズが、画面の大きさを変えても、変わりません <head> <style type="text/css"> img.example1 { width: 100%; height:auto; } </style> </head> <body> <div align="left"> <table width="100%" align="left" bgcolor="#FFFFFF"> <tr> <td width="100%"> <p><img src="x.jpg" alt="x" "class="example1"> </p> </img> </td> どうしたら良いでしょうか?
- テーブルの幅をデフォルトに戻すcssがわかりま
<html> <head> <title>test</title> <style type="text/css"> table { width: 100%; } </style> </head> <body> <table border=1> <tr><td>No</td><td>table1</td></tr> </table> <table border=1> <tr><td>No</td><td>table2</td></tr> </table> </body> </html> このようなソースで二つ目のテーブルだけ table { width: 100%; } を適用しない方法はありますか? 実際はテーブルが複数あり 基本的には table { width: 100%; } をテーブルに設定したいのですが とあるテーブルのみテーブルの幅をデフォルトのサイズにしたいのです。 table { width: 100%; } で全てのテーブルに適用した後に クラスを使って該当のテーブルのみ デフォルトの値に戻す方法は有りますか? <table border=1 class="デフォルトに戻す"> <tr><td>No</td><td>table2</td></tr> </table> としたいのですが テーブルの幅をデフォルトに戻すcssがわかりません。 2つのテーブルの幅は指定したくありません。
- Contact Form7で文字サイズを変更したい
WordPressでホームページを作っています。 プラグインのContact Form7を使ってお問い合わせページを作成していますが、問い合わせフォームの入力する部分の文字サイズを大きくしたいと思います。 どこをどう調整したらいいかよく分からないので、ご存知の方いらっしゃればアドバイスお願いいたします。 htmlとcssは以下になります。 参考に画像も添付いたします。 ■html <table class="table table-bordered table-striped table-contactform7"> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">お名前</span></th> <td>[text* your-name akismet:author watermark"例:山田 太郎"] </td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">メールアドレス</span></th> <td>[email* your-email akismet:author_email watermark"例:×××@×××.com"]</td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">郵便番号</span></th> <td>[text* zip id:zip watermark"例:840-0015"] </td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">都道府県</span></th> <td>[text* pref id:pref watermark"例:佐賀県"]</td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">ご住所</span></th> <td class="address-100">[text* addr id:addr watermark"例:佐賀市木原2丁目25-10 UTビル2F東号室"]</td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">お電話番号</span></th> <td>[text* text-17 watermark"例:0952-60-6240"]</td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">ご相談内容</span></th> <td>[radio radio-256 use_label_element "月額3,000円HP" "月額9,800円HP" "ウェブ広告代行" "その他のご相談"]</td> </tr> <tr> <th><span class="required-contactform7">必須</span><span class="title-contactform7">メッセージ本文</span></th> <td class="message-100">[textarea* your-message watermark"業種・目的・デザインイメージなど"]</td> </tr> </table> <p class="text-xs-center">[submit class:btn class:btn-success class:btn-lg "送信する"]</p> ■css /***** コンタクトフォーム *****/ .table-contactform7{ overflow: hidden; table-layout: fixed; } .required-contactform7{ padding: 5px; background: #DE8686; color: #fff; border-radius: 3px; margin-right: 3px; } .unrequired-contactform7{ padding: 5px; background: #BDBDBD; color: #fff; border-radius: 3px; margin-right: 3px; } .table-contactform7 th{ font-weight:bold; } .table-contactform7 input, .table-contactform7 textarea{ max-width: 90% !important; height: 30px; margin: 5px 10px 10px 5px; } .address-100 input{ max-width: 90% !important; margin: 5px 10px 10px 5px; } .message-100 textarea{ width: 100%; height: 100px; margin: 5px 10px 10px 5px; } @media screen and (min-width: 900px){ .table-contactform7 th{ width:28%; } } @media screen and (max-width: 900px){ .table-contactform7{ display:block; } .table-contactform7 tbody, .table-contactform7 tr{ display: block; width: 100%; } .table-contactform7 th{ width:100%; display:block; margin: 0 auto; border:none; } .table-contactform7 td{ display: list-item; list-style-type:none; margin:0; padding:0; width: 100%; border-top: none !important; } }
- 締切済み
- HTML
- hotrod7020
- 回答数1