PCインストラクターの川上です。
このようなSOSをいただきました↓↓↓
私のブログなのですが･･･
写真をアップロードすると、 かならず写真にフレームが入って、 その下に「photo by shin sawada」が入ってしまうのですが･･･
どうやってこうなったのか全く分からずにいます(ﾉ_-｡)
おそらく最初の段階で・・・どこか触ってしまって こうなったのかと（名前が入れてあるので・・） 思っていますが・・・
どうやったら解消できるのか アドバイス頂けますでしょうか！！？
自分の撮った写真だけだと、まだしも・・・ 全てに入ってしまうので心配です。
（こちら↑のレインボーの囲み枠は、2014年5月17日に書いた 『【便利技】レインボー囲み枠 』をご覧くださいませ^^）
実際にこの方のブログを見てみますと･･･
確かに、ぜ～んぶの画像に
フレームと「photo by ･･･」が入っていますね。
これは、CSSソースが怪しいかな、と思いますので、ちょいと見てみますと･･･
あ、
ありました･･･
/* 枠 */
.articleText a.detailOn {
display: inline;
display: inline-block;
zoom: 1;
margin: 10px;
padding: 10px 10px 20px 10px;
max-width: 480px; /* 画像幅+20程度 */
/* 背景・境界線・影 */
background: #fcfcf7 none no-repeat bottom right;
border: 1px solid;
border-color: #eee #ccc #ccc #eee;
border-radius: 3px;
box-shadow: 4px 4px 8px #aaa, 1px 1px 2px #fff inset, -1px -1px 2px #ddd inset;
/* 文字関連 */
text-align: right;
font-size: 14px;
font-style: italic;
color: #bbb;
text-shadow: -1px -1px 0 #fff, 2px 2px 4px #888;
}
/* 画像 */
.articleText a.detailOn img {
display: block;
height: auto !important;
width: auto !important;
*width: 480px; /* IE6用 */
max-width: 600px;
}
/* 画像下の文字列 */
.articleText a.detailOn:after {
content: "photo by Shin Sawada";
}
このコード↑が、アップロードした画像にフレームと影と「photo by ･･･」を入れているCSSコードなのです。
アメブロのサーバーから記事に投稿した画像は、投稿した後に class="detailOn" と、クラスが指定されますから、これを利用しているわけです。
ですので、このコード↑をそっくり削除すれば、フレームと影と「photo by ･･･」がそっくり消えます。
また、フレームと影はそのまま残しておいて、画像下に入る「photo by ･･･」だけ消したい場合は、
最後の
/* 画像下の文字列 */
.articleText a.detailOn:after {
content: "photo by Shin Sawada";
}
だけを削除するとよいですね。
逆に、記事の画像に影のついたフレームをつけたいときは、↑のCSSコードをCSSの最後にコピペするとよいですね。
ところで･･･
CSSって何？
という方は、私の過去記事『ところでCSSってなんですか～』をご覧くださいませ。
CSSの編集って？
という方は、私の過去記事『「CSSの編集」をクリックするとは』をご覧くださいませ。
ご自分でCSSソースを見たり、追加したり、削除したい場合はこちらの記事↓をご覧くださいませ。
CSSコードを自分で追加したり、修正したり、削除したりするには
以上、アメブロカスタマイズでした。
LIDS札幌・ライフデザインスクール
川上 雄大
