スタイルシートで貼り付ける写真を丸くする方法

スタイルシートで貼り付ける写真を丸くする方法です。

今回の方法はパソコンからの編集でないとできないと思われます。

スマホのブログアプリからの編集だと、スタイルをいじれないものが多いです。

↓手順です

貼りたい写真をいつものように貼り付けます。
貼り付けたものを、HTMLでどのようになっているか見ます。
<img src="http/://cdn-1234.jpg" alt="cdn-1234.jpg"/>"というような記述があります。青い部分は貼った写真の情報になるので、上記の表記とは異なります。
上記の表記の下に、↓の表記をコピーして貼り付けます。
<style></style>
<div class="photo"><img src="　" alt="　" width="100％" /></div>
img src = "の後に来る部分が、写真の置いてある場所の記述になります。上記3.で表記されていたimg src = "　"　で囲まれた青い部分の記述を、4.で貼り付けた記述の"　"の中に貼り付けます。
altは写真が何らかの理由で表示できない時に記述させる文字です。これも5.と同じように、"　 "の中に、3.のalt以降の青い記述を貼り付けます。貼り付け終わったら、3.の記述は消去します。
プレビューで見ると写真が丸くなっています。上記4.の緑になっている部分は写真の大きさになります。数字が大きくなると写真サイズが大きくなります。スマホだと300ｐｘぐらいまでが上限でしょうか。

手帳にいつも隠してある
あの人の写真
少しも色褪せることはない
石垣のある公園の桜の下
晴れているけど　まだ少し寒そう

人は誰もがいつか旅立つと
わかってるつもりでいたけれど

何気に眩しいその笑顔眺めれば
静かに一筋涙はつたい落ちる
大事な誰かがいるなら
皆そうでしょう
もう一度会いたい　たったそれだけ

あんまり本を読まない私だったから
少し離れてその本棚を見る
長い物語がひしめき並んでいる
いつかプレゼントしたのは木の栞

埃を踊らせる優しい陽差し
ゆっくり深く息を吐き出して

勇気をしぼってページをめくってみる
あなたの足取りを追いかけるように
カレンダーを後ろにめくっていけるのなら
もう一度会いたい　たったそれだけ

何気に見つめているうち　いったいどれだけ
時間が私をすり抜けてゆくの
行き場をなくした愛情を今はただ
この胸にそっとしみこませる

誰にも言わない　叶わぬ夢と知ってても
何もないままじゃ明日を待てない
大事な誰かがいるなら
皆そうでしょう
もう一度会いたい　たったそれだけ

photograph 稲葉浩志

作詞︰稲葉浩志

ここから

未来のビジョン

スタイルシートで貼り付ける写真を丸くする方法

スタイルシートで貼り付ける写真を丸くする方法です。