goo blog みょうがのときどきにっき

月子のティーハウス(絵本)を作成しております

ぼっちのスタイルシート(改行)

2023年12月25日 | ぼっちのスタイルシートなど

ご訪問して頂きありがとうございます

今回はスタイルシートの改行(Enter)についてご紹介をさせてください
私のブログ記事・ソースコードはこの様な感じです

一番最後(下)の行をご覧頂けただけますでしょうか?

<p style="text-align: center,"><span style="font-size: 18px">
これからもよろしくお願いいたします</span></p>

この様に記述してあるかと思います
これでは少し「分かりづらいかな?」と思ってしまいます

こちらを改行(Enter)キーを利用して整理しようと思います

      ① <p style="text-align: center,"> 改行(Enter)

       ② <span style="font-size: 18px"> 改行(Enter)

         ③これからもよろしくお願いいたします 改行(Enter)

④ </span> 改行(Enter)

⑤ </p>

この様にするといかがでしょうか?
箇条書きであることが、お分かり頂けましたでしょうか?

①は文章の位置や配置(text-align)について
     ②はフォントサイズ(font-size)について
③は本文となります

スタイルシートも複雑になればちょっと…
私にも難しいです

しかしシンプルにすると箇条書きです
それでは
p と /p、span と /span

これらはどの様な意味でしょうか?
括弧「」や段落に近い記号です

括弧そして括弧を閉じるという感じです
「拝啓」⇔「敬具」や「記書き」⇔「以上」とも似ております

括弧や段落に挟まれた
箇条書きとお考えになるといかがでしょうか?

ご参考にして頂ければ幸いです

ご一読ありがとうございました

 

 

コメント
  • X
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする

ぼっちのスタイルシート(色彩)

2023年12月25日 | ぼっちのスタイルシートなど

お越し頂きありがとうございます

今回はカラー(色彩)についてご紹介をさせて頂きます

皆さまは文書の記述をされる時
蛍光ペンなどを利用して、カラーを付けることと思います

普段はカラーパレットから私も選んでおります
今回はスタイルシートを利用してカラーを選んでみたいと思います

それでは私のブログ記事・ソースコードをご覧頂きたいと思います

1番上の行をご確認頂けますでしょうか?

<p style="text-align:center;">
<span style="font-size:30px; color:#1e70aa;">月子のティーハウス</span></p>
となっております

こちらのcolor:#1e70aa; が色彩番号となります

それでは下のカラーチャートを参考にして変更しようと思います
カラーチャートはHTML・CSS関連の本
あるいはネット上などで確認することができます

参照:できるブログ(gooブログ)・インプレス

月子のティーハウス   blueviolet #8A2BE2

月子のティーハウス   olivedrab #6b8e23

月子のティーハウス   slateblue #6a5acd

この様な感じでいかがでしょうか?
デリケートな色彩が表現できるかと思います

皆さまの文章や画像と連携した
コーディネーションの良いカラーを選んで頂けると嬉しいです

ご一読ありがとうございました

コメント
  • X
  • Facebookでシェアする
  • はてなブックマークに追加する
  • LINEでシェアする