すべてのカテゴリ

Yahoo!ショッピングのショップに、詳細検索窓を設置していきます。パソコン・スマホ両方で使えます。完成見本▼こんな感じになる予定htmlをコピペしよう▼下記をhtmlが書けるところにコピペして下さい。2行目のhttps:の後のスペースは詰めて下さい。<div style="margin: 0 auto;max-width: 190px;padding: 5px;"><form name="form1" method="get" action="https:　//store.shopping.yahoo.co.jp/★ショップURL★/search.html"><p style="margin: 10px 0;width: 100%;"><input type="text" name="p" value="" placeholder="ショップ内検索" style="box-sizing: border-box;width: 100%;max-width: 300px;height: 35px;margin: 0;border: 1px solid #d8d8d8;border-radius: 3px;background: #fff;color: #333;"></p><p style="margin: 10px 0;width: 100%;"><span style="font-weight: bold;font-size: 90%;">商品価格</span></p>

CSSは装飾系を指定するもの。文字サイズを指定したり、色をつけたり、背景に画像をつけたり。。。CSSを適用させる方法としては3通り。（Javascriptとか置いといて）①htmlタグに直接書く②html内の<style></style>の中に書く③cssのファイルを作る今回もサクッとわかりやすい解説に努めます！①htmlタグに直接書く例えば、下記のようにpタグなどに直接書く方法です。<p style="color:red;">月曜日は定休日です。</p>▼▼▼こうなる▼▼▼②html内の<style></style>の中に書く下記のように、styleタグ内に書く方法です。<p style="color: red;">月曜日は定休日です。</p>  <style>   p {    background: yellow;    color: orange;   }▼▼▼こうなる▼▼▼気づきましたでしょうか、上の例ではpタグに、「文字赤くしてよ」という指定と、「文字オレンジにしてよ」っていう指定をしています。②の<style>の中から指定するより、①の直接指定した方が優先度が高いので、文字色は赤になっています。ちなみに、Yahoo!ストアクリエイター内にはstyleタグは書けないので、①か③の方法を使います。③cssのファイルを作る例えば、style.cssなどと名前をつけたファイルを作って、それをhtmlに読み込ませます。（このcssを適用してねと指定する）外