テスト記事を作成しています。本文に挿絵を入れるのに,文字で作ったらどうなんだろうか?
この記事を作るにあたっては,以下のリンクページの記事を参考にさせて頂きました。


[/ふきだし]
[/ふきだし]
ともすれば,なかなか挿絵をすべての記事に入れ込むのは骨が折れる作業という事になるんよね💦
ということで,まず主張したいのは…。
挿絵を入れるのは,
めんどくさい
うれしい
イラストはFontAwsomeからとってくるだけで,あとは自分で言いたいメッセージを添えることで挿絵にできる…。
素晴らしすぎひん?
いや,コレは事件やで,事件。
ちなみに,僕の場合は見出しの下には『質感のある』挿絵を使って見出しが目立つようにして,次の大見出し前に『3Dな』挿絵を使うようにしてみました。
使ってみると…
エエ感じ
人の褌で相撲を取るようですんごい恐縮なのですが,スマホ表示が崩れてしまう事が気になりました。
少しいじってみたコードを紹介します。
カスタマイズしたのは2点
カスタマイズ
/*----------------------------
CSSテキスト挿絵 ikaga-6
-----------------------------*/
.ikaga-6 {
background: #11a9e2;
width: 100%;
margin: 0 auto;
padding : 50px 40px 50px 40px ;
text-align: center;
}
@media screen and (min-width: 769px) {
.ikaga-6 p {
font-size: 64px;
color: #fff;
margin: 0;
font-weight: bold;
text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15);
}}
@media screen and (max-width: 768px) {
.ikaga-6 p {
font-size: 36px;
color: #fff;
margin: 0;
font-weight: bold;
text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15);
}}
カスタマイズ
/*----------------------------
CSSテキスト挿絵 ikaga-7
-----------------------------*/
.ikaga-7 {
width: 100%;
text-align: center;
margin:0 auto;
padding : 50px 40px 50px 40px ;
background: linear-gradient(to bottom, #ece4d9 0%, #e9dfd1 100%);
}
@media screen and (min-width: 769px) {
.ikaga-7 p {
display: block;
font-size: 64px;
color: #f1ebe5;
text-shadow: 0 8px 9px #c4b59d, 0px -2px 1px #fff;
font-weight: bold;
margin: 0;
}}
@media screen and (max-width: 768px) {
.ikaga-7 p {
display: block;
font-size: 36px;
color: #f1ebe5;
text-shadow: 0 8px 9px #c4b59d, 0px -2px 1px #fff;
font-weight: bold;
margin: 0;
}}
楽しく書く
ともかく,挿絵は脱力しながらも出来れば入れたい…。僕のワガママな願いが叶いそうです。
挿絵を使う理由は個々人ちがってると思います。
けれど,僕は『記事にリズムが出せて,書くのが楽しくなるって書きたいから使う』ことを重視してます。
もしもこの記事を読んで,挿絵で記事にリズムが付けられるようになって楽しくなった!と思う方がいたら良いなぁって思いつつ,この記事を終わりにしたいと思います。
おしまい
[kjk_temp id=”5491″]
記事の感想など,ひとこと頂けますか?