質問する
質問を探す 詳しく検索する

解決済

Clip!
tocchimechin

ブログの文章の先頭の文字を装飾するには？

文章の最初の文字を大きくしたり、四角で囲んだりする方法を下記のサイトで見つけたのですが、うまくできませんでした。
http://www.1uphp.com/con1/abc/first-letter.html
http://www.1uphp.com/con1/abc/first-letter.html
clip


livedoorのブログの場合、どの位置にタグを挿入すればいいのでしょうか？

2006-10-05 19:39の質問
この質問と回答を読んで役に立った場合は「役に立つ質問」に投票してください。投票が多い質問は、役に立つ質問一覧に掲載され、より多くの人に見てもらうことができます。
Ads By Google
<<前の質問を見る
次の質問を見る>>

回答(3)

4.

2006-10-08 18:38:55ベスト
万年床生活者
>>#6
foissotteさんの方法を試したところ、
サイドバーにあるフリーエリアの文章の先頭のみが装飾されました。（投稿記事はそのままです。）
まさか、記事の文頭に<P>タグを入れ忘れている
・・・というコトはないでしょうね？（＾＾；）
<P>投稿記事の先頭の文字</P>
>>1 の通りにやれば、「投」がデカくなるはずなのですが・・・。

そのまさかでした。無事に投稿記事の先頭を装飾することに成功しました。ありがとうございました。

1.

2006-10-05 21:04:36
foissotté
p:first-letter
              {
              font-size:200%;
              float:left;
              border:solid 1px #ff0000;
              color:#ffffff;
              background-color:#ff66ff;
              padding:3px;
              }
はCSSに書き込むことになりますね。これを
.blogbody{}
の下あたりに追加する形で行うといいかもしれません。
回答レベル : アドバイス

3.

2006-10-06 18:58:15
Kiss115
スタイルシートで各記事を装飾するのは困難かと思います

HTMLタグを書き込むなら
シンプルエディタでそのままタグを打てば反映されます。

ただ、御指摘のURLのように表示するにはタグも複雑になるかと思います。

相当荒治療ですが

ワードなどで一旦記事文を装飾
（ドロップキャップ、囲み、網掛け…など）して
それをワードの上でコピーし
WYSIWYGエディタで
記事を書く部分にそのままコピーして投稿してみると
私は（IE6ですが）上手くできました。

環境、選択されているデザインにより
見え方が様々ですが・・・。
回答レベル : アドバイス
Ads By Google

コメント(14)

コメントする
#1.  Kiss115
2006-10-05 21:23:54

投稿記事の文字の大きさのことでしょうか？

#2.  tocchimechin
2006-10-05 22:28:28

>hitomi115さん
そうです。投稿記事の先頭の文字です。

#3.  Kiss115
2006-10-05 22:33:50

「管理ページトップ」から
「カスタマイズ／管理」で
ブログの設定の「投稿の設定」を選択

投稿フォームの形式は

シンプルエディタ

WYSIWYGエディタ

どちらをお使いですか？

#4.  tocchimechin
2006-10-05 22:43:21

>hitomi115さん
早速のご回答ありがとうございます。
「管理ページトップ」→「カスタマイズ／管理」→
ブログの設定→「投稿の設定」を選択しても、
投稿フォームの形式という項目がありません。
どのような情報をお伝えすればよろしいでしょうか？

#5.  Kiss115
2006-10-05 22:55:25

投稿の設定

投稿時の状態

投稿フォームの設定

投稿フォームの形式

更新ping送信先
※改行で10個まで入力可

というのが見当たりませんか？

ブラウザはIE6でしょうか？

#6.  tocchimechin
2006-10-05 23:02:36

>hitomi115さん
safariを使用していたために表示されなかったようです。
firefoxにて確認致しました。失礼しました。
投稿フォームの形式は現在シンプルエディタになっています。
ちなみに上記のfoissotteさんの方法を試したところ、
サイドバーにあるフリーエリアの文章の先頭のみが装飾されました。（投稿記事はそのままです。）

#7.  Kiss115
2006-10-05 23:14:50

簡単な方で説明します

WYSIWYGエディタ
を選択して「設定を保存する」
にして下さい。

そして「ブログの投稿」を試して見てください

入力欄の上に文字のサイズなど
設定する場所が出てくると思いますので
大きくさせたい文字を
左クリックでドラッグして反転させて
文字の大きさなどを
変えて投稿して見てください（大きさ３は普通）

#8.  tocchimechin
2006-10-05 23:21:52

>hitomi115さん
ありがとうございます。
できれば質問で書いたURLのような装飾を
考えています。
またお時間のある時にでも教えてください。

#9.  Kiss115
2006-10-05 23:35:39

選択した文字を大きくされたいのだと
勘違いしてました。

すみません。

#10.  Hukamin
2006-10-08 16:47:03

以下のように指定してもダメでしょうか。

.main:first-letter {
	(中略)
}
a:link {（中略）}やa:hover {（中略）}みたいな感じで、「.main」の「first-letter（つまり最初の文字）」だけに指定したいよ、という意味です。

#11.  万年床生活者
2006-10-08 18:45:29

>>4 補足
ちなみに、シンプルエディタのプレビューの段階ではまだ反映されませんよ。
実際に投稿してから確認してください。

#12.  Kiss115
2006-10-08 20:34:58

さすが、万年床生活者さん！

各記事毎に装飾を変える方法だと
思い込んでました・・・。

#13.  万年床生活者
2006-10-09 09:37:46

＞tocchimechinさん
うまくいってよかったですね。
ベストありがとうございました。
　

＞hitomi115さん
最近は回答のほうでも活躍されてますね（＾＾）
＞さすが、万年床生活者さん！
まぐれですよ(^_^;)
hitomi115さんと質問者さんのコメントのやりとりが私の回答のヒントになりました。
ありがとう(^^)


＞foissotteさん
後から来た人間がおいしいとこだけ持ってっちゃってスミマセン（＞ ＜）

#14.  Hukamin
2006-10-09 23:42:34

テストしてみたところ、CSSに

.main:first-letter {
	font-size: 200%;
	float: left;
	color: #ffffff;
	background: #708090;
	padding: 3px;
}
と記述したところ、文章の前に画像がある記事（最初に画像が表示される記事）以外は全ての記事の一番最初の文字に適用されました。
もし、全ての記事に適用したい場合は、「.main:first-letter」か「.blogbody:first-letter」に指定すると良いかもしれません。
「○○:first-letter」の「○○」にはクラス名やID名、タグ名などを記述して指定すると、装飾したい箇所を指定できます。
覚えておくと良いかもしれません。
解決されたようで良かったです。

トラックバック

トラックバックURL: