人力検索はてな
ﾓﾊﾞｲﾙ版を表示しています｡PC版はこちら
i-mobile
はてなﾌﾞﾛｸﾞでAmazon商品を埋め込むときの設定についての質問です｡

たとえば､
http://statsbeginner.hatenablog.com/entry/2014/08/23/110912
↑のﾌﾞﾛｸﾞ記事にAmazonの書籍のﾘﾝｸを埋め込んでいるのですが､このAmazon商品の部分だけ文字を少し小さくするには､どうすればいいのでしょうか｡
CSSでの設定方法を知りたいです｡しばらくｸﾞｸﾞった限りでは分かりませんでした…｡
よろしくお願い致します｡
●質問者: 夜会
●ｶﾃｺﾞﾘ:ｺﾝﾋﾟｭｰﾀ ｲﾝﾀｰﾈｯﾄ
○ 状態 :終了
└ 回答数 : 1/1件
▽最新の回答へ
▽1 ● a-kuma3
●100ﾎﾟｲﾝﾄ ﾍﾞｽﾄｱﾝｻｰ

ﾃﾞｻﾞｲﾝCSS で､以下を追加｡

DIV.hatena-asin-detail IMG.hatena-asin-detail-image {
 width: 100px;
}

ただ､画像は小さくなるのですが､右側の文字が､画像の下に回り込むことになります｡
f:id:a-kuma3:20140823123847p:image

画像の下に､文字が回り込むのが嫌ならば､margin-bottom を指定します｡

DIV.hatena-asin-detail IMG.hatena-asin-detail-image {
 width: 100px;
 margin-bottom: 100px;
}

こんな感じ｡
f:id:a-kuma3:20140823124808p:image

それぞれの数値は､調整してみてください｡



追記です｡

すみません､小さくしたいのは､文字でしたね ＞＜｡

説明の文字を小さくするなら､こんな感じ｡

DIV.hatena-asin-detail .hatena-asin-detail-info li {
 font-size: 70%;
}

f:id:a-kuma3:20140823142210p:image

書籍名(ﾀｲﾄﾙ)も含めて､小さくするなら､こんな感じです｡

DIV.hatena-asin-detail .hatena-asin-detail-info li {
 font-size: 70%;
}
DIV.hatena-asin-detail .hatena-asin-detail-title {
 font-size: 70%;
}

f:id:a-kuma3:20140823142334p:image

夜会さんのｺﾒﾝﾄ
ありがとうございます｡ すみません､小さくしたいのはAmazon商品の領域内の｢文字｣なのですが､こちらはどうすれば操作できますでしょうか？
a-kuma3さんのｺﾒﾝﾄ
>> すみません､小さくしたいのはAmazon商品の領域内の｢文字｣なのですが､こちらはどうすれば操作できますでしょうか？ << すみません､小さくしたいのは文字だ､って､はっきり書いてありますよね <tt>X-|</tt> 回答に追記しましたので､確認してみてください｡
夜会さんのｺﾒﾝﾄ
ありがとうございます！ 良い感じに設定できました｡ ついでに､教えていただいたimgの設定も変えてみました｡ 助かりました｡
関連質問
●質問をもっと探す●

0.人力検索はてなﾄｯﾌﾟ
8.このﾍﾟｰｼﾞを友達に紹介
9.このﾍﾟｰｼﾞの先頭へ
□対応機種一覧
□お問い合わせ
□ﾍﾙﾌﾟ/お知らせ
□ﾛｸﾞｲﾝ
□無料ﾕｰｻﾞｰ登録
□はてなﾄｯﾌﾟ