BiND for weblifeで文章の大きさ・色・背景を変える:BiND for weblifeの応用

印刷用表示 |テキストサイズ 小 |中 |大 |

BiND for Weblifeというホームページ作成ソフトの使い方をまとめたサイト(覚書)である。 初心者の方でもSEOに配慮した、デザイン性に優れたウェブサイトの作成ができるソフトの使い方を紹介。BiND1~3の基本的な使い方は同じです。最新版になるにつれて付加機能が増えているって感じです。

| HOME | BiND for Weblife応用編 | 文章の大きさ・色・背景を変える |

レンタルサーバーの選び方SEO対策作業の能率化

ブックマークに追加する

文章の大きさ・色・背景を変える

こちらは、BiNDタグ辞典を元に作成しました。

HTMLタグ機能もありますが、これは1行ずつ設定する必要があるし、一行のうち、一部分だけ使いたい時には活用できないようです。
BiND for weblife のブロックエディタを起動します。
タグこのHTMLタグ機能は使わない管理者


なのでカスタムタグを活用

カスタムタグを活用して、文章内にスタイルシートを各々活用して文字の大きさを変えれるようになっているのです。

スタイルシートについては、こちらを参考にどうぞ




文字を太字にする

<strong>文字を太字にする</strong>

文字色を赤くする

<span style="color: #FF2D00;">文字色を赤くする</span>

文字色を青くする

<span style="color: #6F8AF5;">文字色を青くする</span>

文字色を緑にする

<span style="color: #67C54B;">文字色を緑にする</span>

文字色を黄にする

<span style="color: #E7F53D;">文字色を黄にする</span>

文字色を白にする

<span style="color: #FFFFFF;">文字色を白にする</span>

文字の背景に色を付ける

<span style="padding: 2px 2px 2px 2px; background-color: #6F8AF5;">文字の背景に色を付ける</span>

文字に枠を付ける

<span style="border: 1px #B4B4B4 solid; padding: 2px 2px 2px 2px; ">文字に枠を付ける</span>

文字を大きくする

<span style="font-size:15pt;">文字を大きくする</span>


組み合わせ編

文字を太字にして赤字にする

<span style="color: #FF2D00;"><strong>文字を太字にして赤字にする</strong></span>

文字を大きくして青色にする

<span style="font-size:15pt;color:#6F8AF5;">文字を大きくして青色にする</span>

背景を赤にして文字を白字にする

<span style="padding: 2px 2px 2px 2px; background-color: #FF2D00;color:#FFFFFF;">背景を赤にして文字を白字にする</span>

背景を青にして文字を白字にする

<span style="padding: 2px 2px 2px 2px; background-color: #6F8AF5;color:#FFFFFF;">背景を青にして文字を白字にする</span>

背景を緑にして文字を白字にする

<span style="padding: 2px 2px 2px 2px; background-color: #67C54B;color:#FFFFFF;">背景を緑にして文字を白字にする</span>

背景をオレンジにして文字を白字にする

<span style="padding: 2px 2px 2px 2px; background-color: #FFB443;color:#FFFFFF;">背景をオレンジにして文字を白字にする</span>

背景をグレーにして文字を白字にする

<span style="padding: 2px 2px 2px 2px; background-color: #606060;color:#FFFFFF;">背景をグレーにして文字を白字にする</span>

応用編(オマケ)

点線で囲む

<span style="border: 1px #6a6a6a dashed; padding: 5px 15px 5px 15px;">点線で囲む</span>

タイトル風にする

<span style="font-size:12pt;color: #6F8AF5; border-top: 3px #6F8AF5 double; border-right: none; border-bottom: 3px #6F8AF5 double; border-left: none; padding: 5px 200px 5px 5px;">タイトル風にする</span>

ボタン風にする

<a href="http://ここにURLを記述" target="_blank"><span style="color: #FFFFFF; border: 1px #6a6a6a solid; padding: 5px 15px 5px 15px; background-color: #88beba;">ボタン風にする</span></a>

サイト運営に参考となる作成サイト

運営者が画像素材を探すのに活用しているサイトを紹介

  • Fotolia
    • 私が数少ない画像素材を購入しているサイト。画像数は豊富なので無料サイトを探し回るより素早く良い素材を見つけることができます。
  • 写真素材の定額制ダウンロード販売サイト
    • 日本人向けの写真が豊富。無料で会員登録すると一部の画像が1日5枚まで無料でダウンロードできます。写真の質は良いので私も登録しています。




ブックマークに追加する
▲ ページトップへ

ランキング: SEO対策:BIND

  • 参考になったら応援お願いします。

ブックマークに追加する

 



私も活用して2年になります
画像が豊富なので、無料画像を探すより早い!


Yahooカテゴリ登録サイトです(2008/7/3)

簡単相互リンク