『CSS ドロップキャップ』

※リンク実験中↓下のリンクは記事とは関係ありませんm(_ _)m

-----------------------------------------------

実は・・・・javascriptはじめてまだ1ヶ月くらいなんです・・・
本当はCSSの方が得意だったりして・・・
でも、今はjavascriptにはまちゃっています・・・
が、行き詰まって良い考えもでてこないので
で、ドロップキャップでもやってみました？？？
↑・・・・・・・・・・・？？です

まず、記事を書きます
そのとき、ドロップキャップを付けたい段落を一固まりにして
<p class="dcap">と</p>で囲ってください（HTMLタグを表示）
その中の1番目の文字がドロップキャップになります

たとえば昨日の書き方の例　　←thickboxでこんなこともできます

デザインの変更　→　スキンCSSの編集　で、
枠内の1番下に下記の部分(青字部分)をコピペする

/*■■■■■■■■　ドロップキャップ　Mac版IE対策　■■■■■■■■\*/
p.dcap:first-letter {

color: #ffffff;
font-size: 270%;
float: left;
line-height: 1;
padding: 3px;
margin-right: 3px;
background-color: #cc0000;
}
/* ■■ ここまで ■■ */

プレビュー　を押して確認して成功していれば　保存
色の変更は #cc0000 を変えてください
文字の色は #ffffff を変えてください

※backgroundに画像も使えますよ・・・・・

クラス指定しないで記事を書けば自動でもできるのですが・・・

ウザイので

クラス指定で、必要なところで使ったほうが使いやすいです

ブログ画像一覧を見る

このブログをフォローする

アメブロ向上企画書ーCSSでカスタマイズ、オリジナルなスキンに挑戦！

CSS ドロップキャップ