Q.OOPS!にてフリースペースの設定について教えて欲しい
TCDテーマオプション→トップページ→フリースペースにて画像を使用しているのですが、レスポンシブデザインにする方法がわからないので教えて下さい。
A.下記に編集の参考例をあげさせていただきます。
フリースペースについては、CSSなどの指定を行い
レイアウトをご調整いただくことで表示をご調整ください。
例えば、弊社デモサイトでは、下記のようなCSSを
TCDテーマオプションン→基本設定→カスタムCSSに記載しております。
ご参考にご覧くださいませ。
■フリースペース内の内容
<div class="p-freespace__inner l-inner"> <h2 class="p-showcase__catch">OOPS!を体験する!<br>30日間トライアルダウンロード</h2> <p class="p-showcase__desc">このスペースは「フリースペース」になります。ここにお好きな文章や画像を入れてください。<br /> HTMLの入力も可なので、自由度の高いコンテンツ作成が可能です。メールフォームはご自身でご用意ください。</p>
■カスタムCSS内の内容
.p-freespace__inner { width: 88.88889%; box-sizing: border-box; text-align: center; } .p-freespace__inner .p-showcase__catch { margin-bottom:6px; } .p-freespace__inner .p-showcase__desc { margin-bottom:5px; text-align:left; font-size:14px !important; }
実際の画面
尚、HTMLやCSSについての基本知識についてはサポートの対象外です。
CSSの基本的な知識については、書籍などでご確認頂き、ご変更下さいませ。
参考サイト:http://www.htmq.com/csskihon/001.shtml
この記事は役に立ちましたか?
もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!