サイトのトップページに、javascriptのスライドショーを配置したいと思っています。
(イメージはこんなスライドです)
http://sandbox.scriptiny.com/tinyslider2/
WEBデザインもまだ勉強中でプログラム領域の知識は全くないため、
サンプルコードを公開しているサイトさんでお借りしようと思っています。
例の通りにcssやjsをリンクさせ、スライド自体は上手く行っているのですがレイアウトがうまくいきません。
(中途半端にスライドしたり、画像送りのボタンが表示されなかったり)
問題点として、サンプルのcssの記述と、もともとのサイトのcssがぶつかってしまう(?)ことがあります。
どのサンプルもcssで
margin:0;padding:0;
がbodyもしくはアスタリスク(*)で全要素に指定されており、
これが元のトップページのcssレイアウトに影響してしまいます。
こういう場合、cssの処理はどうするのが適正でしょうか。
素人のため分かりにくい文章になってしまっておりますが、その際はご指摘いただけましたら幸いです。
宜しくお願いいたします。
No.1ベストアンサー
- 回答日時:
例のサイトは、
<div id="container">
内にスライドショーが配置されているので、
*{margin:0;padding:0;}
を
div#container *{margin:0;padding:0;}
とすれば良いでしょう。
(本来は、アスタリスクの全称指定でリセットせずに個別指定した方が良い)
そうすれば、元のデザインには影響する事がなく、
スライドショーだけに適応されます。
但し、質問者さんの構造が
スライドショーの外枠が<div id="container">だとは限らないし
別のセレクタが関係している場合や優先度の問題もありますので・・・
早速の回答ありがとうございました。
ご指導いただいた内容で一度やってみます。
positionの指定や優先度など、知識がたくさん必要ですね・・・。
また結果もご報告できればと思います。
ありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS 下にスクロールしても、追従するボタンのコードを書いたのですが、ボタンの中の画像が半分しか表示されない 1 2022/04/16 21:31
- HTML・CSS Affinger6でトップページに記事をタイル状に並べたい 1 2023/05/20 14:55
- ホームページ作成・プログラミング ホームページ作成について。「ワードプレスではありません」。 3 2023/08/13 14:44
- HTML・CSS Dreamweaver のテンプレートでの相対パスの設定について 2 2023/06/13 17:28
- HTML・CSS 【HTML】【CSS】【Swiper】 元の画像は横1200×縦600なのですが、実際のサイト上に反 5 2022/07/16 13:57
- HTML・CSS スクロールすると追従する画像のコードを書いているのですが、追従する画像の大きさの調節が上手くいきませ 2 2022/04/18 12:52
- HTML・CSS サイトをマルチデバイス対応にする為の準備や、CSSなどのおすすめサンプル集やアドバイスを頂きたいです 1 2022/07/13 22:15
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- その他(プログラミング・Web制作) 次に、楽天のアジャイル就活に参加して、1日で内定を獲得できる。私は大企業に就職できる? 2 2022/04/17 13:38
- HTML・CSS CSSがなぜかfont-sizeだけ効かない...記述がまちがっているんでしょうか 5 2022/04/09 17:52
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
CSS、Bootstrapについて contai...
-
携帯では指定のタグを無効化す...
-
safari でcssがききません!
-
outlook 文字を揃えたい。tab...
-
Excel:一部のフォントでセルの...
-
マイクロ(μ)の文字を半角で出...
-
CSSについて教えてください。 ...
-
テーブル内の文字サイズを変更...
-
入力規則のリストの文字の大き...
-
MsgBoxについて
-
テキストエディタmiの表示文字...
-
教えてください。
-
ユーザーフォーム スクロール...
-
ペイント3Dのテキストサイズ変更
-
PDFファイルを開かずに印刷...
-
Illustratorで作成、pngで保存...
-
cssファイルの名称付け
-
SELECTのプルダウンの長さの調整
-
「MS Pゴシック」と同じ幅の...
-
文字の位置、上下のマージンが...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ホームページについて質問です...
-
cssでリンク先のurlを表示させ...
-
safari でcssがききません!
-
メールソフトBecky!のHTMLメー...
-
複数のcheckboxを間隔を空けず...
-
携帯では指定のタグを無効化す...
-
CSSシグネチャ
-
Chromeでcssを表示させると、cs...
-
スクロールバーをカスタマイズ...
-
cssの今、一番旬なブラウザごと...
-
googleカスタム検索の枠を消したい
-
bootstrapのどのcssドキュメン...
-
リンクの色一括指定について。
-
ホームページビルダーでcssのサ...
-
文字の色、大きさを変えるWe...
-
outlook 文字を揃えたい。tab...
-
マイクロ(μ)の文字を半角で出...
-
入力規則のリストの文字の大き...
-
教えてください。
-
Illustratorで作成、pngで保存...
おすすめ情報