ホームページビルダーで文字の背景色を変える方法は？

締切済

質問者：nova-usa
質問日時：2013/06/23 23:44
回答数：4件

自分のＨＰの更新した箇所が分かり易いように、背景色を黄色等に変えて表示させようと考えています。
ホームページビルダー１３（ＨＰＢ１３）を使っているのですが、文字の色ではなく、文字の背景色を変える方法をご存じの方、教えて下さい。

もし、背景色を変える以外に、更新箇所が分かり易い方法があれば、そちらも合わせてお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (4件)

最新から表示
回答順に表示

No.4

回答者： naokita
回答日時：2013/06/26 00:49

CSSの１プロパティだけ覚えれば簡単にできますし、

ホームページビルダーのツールでもできるでしょうが、

素人さんでも簡単に設定する方法は、
辞書ツールに「こうしん」（更新）という単語を登録で、下記の１行を単語登録
<span style="background:yellow;">更新</span>

更新したい時に、テキスト上で、
「こうしん」と打って変換ボタンを押せば、
<span style="background:yellow;">更新</span>
が出てきますので、真ん中の文字「更新」の部分に文章を入れれば、その文章の背景は黄色になっています。
ホームページビルダーなんて不要って事です。メモ帳でOK。

例：
<span style="background:yellow;">ありうえおかきくけこ</span>

別に「更新」じゃなくとも、何の単語や数字でも良い訳ですが・・・

何故　<span style="background:yellow;">　</span>　で色が変わるのか？調べるとCSSを自由に使えるようになるでしょう。

- 0
- 件

通報する

この回答へのお礼

回答ありがとうございました。

通報する

お礼日時：2013/09/17 00:24

No.3

回答者： Z31
回答日時：2013/06/24 09:16

背景色を変えたい文字列を選択状態で、スタイルシートマネージャを開きます。

スタイルシートマネージャは「表示」の中にもありますし、「赤いＳ」のマークのアイコンがそうです。

「追加」ボタンをクリック→「色と背景」タブをクリック→「前景色」「背景色」がありますから「背景色」を希望の色に選択→「閉じる」でできます。

なおビルダーのサイトをご紹介しておきます。参考になると思います。

http://www.wsb.jp/hpb/

- 1
- 件

通報する

この回答へのお礼

回答ありがとうございました。

通報する

お礼日時：2013/09/17 00:21

No.2

回答者： ORUKA1951
回答日時：2013/06/24 09:06

＞自分のＨＰの更新した箇所が分かり易いように、

HP(ヒューレッドパッカード)じゃなく、ウェブページ/HTMLの更新場所ですね。
　⇒ホームページという言葉、および略語( http://ja.wikipedia.org/wiki/%E3%83%9B%E3%83%BC% … )
　⇒名称の影響( http://ja.wikipedia.org/wiki/%E3%83%9B%E3%83%BC% … )

＞自分のＨＰの更新した箇所が分かり易いように、
　HTMLでは、<del><ins>という要素(タグ)が用意されています。
※他に適当な要素があるのに<div>や<span>を使用するのは避けるべきです。<span>や<div>は最後の手段で、これらを使うときは文書構造を補完するidやcalssをつけます。
　⇒div 要素の【注意】( http://www.html5.jp/tag/elements/div.html )
　⇒DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するための( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )

[例]
<p>
　HTMLにおいて、修正は<del>ホームページ</del><ins datetime="2013-06-23">ウェブページ</ins>のようにマークアップします。</p>
　⇒9.4 文書の変更に目印をつける: INS要素とDEL要素( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )

　そして、スタイルシートで、
del{dispaly:none;}
ins{background-color:yellow;}
　とすれば良いです。

★ビルダーを使おうと、HTMLやCSSの知識は絶対に必要です。それどころか、テキストエディタで作成する人以上に、それらを良く知っていなければなりません。でないと変なHTMLを作成してしまいます。→ http://ja.wikipedia.org/wiki/%E3%83%9B%E3%83%BC% … 決して逆じゃないですよ。
　HTMLやCSSのしっかりした知識に加えてツールでの方法や癖を知る必要があるということです。
★修正する文字列を選択して、タグの挿入で削除(ins)を選択して、新しいテキストは同様に挿入<ins>を選択します。
★その後、スタイルシートでデザインを好きに指定します。

　それだけで、誰(検索エンジンも)が見ても、内容が理解でき、メンテナンスが容易な互換性の高いページが出来ます。

[サンプル]
ヘッダ(div class="header"></div>と本文<div class="section"></div>内で異なるデザインが書かれています。比較してください。
★タブは＿に置換してあるので戻す。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
＿<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
＿<title>サンプル</title>
＿<meta name="author" content="ORUKA1951">
＿<meta http-equiv="Content-Style-Type" content="text/css">
＿<link rev="made" href="mailto:oruka1951@hoge.com" title="send a mail" >
＿<link rel="START" href="../index.html">
＿<style type="text/css">

＿</style>
</head>
<body>
＿<div class="header">
＿＿<h1>タイトル</h1>
＿＿<p>HTMLにおいて、修正は<del>ホームページ</del><ins datetime="2013-06-23">ウェブページ</ins>のようにマークアップします。</p>
＿</div>
＿<div class="section">
＿＿<h2>見出し</h2>
＿＿<p>HTMLにおいて、修正は<del>ホームページ</del><ins datetime="2013-06-23">ウェブページ</ins>のようにマークアップします。</p>
＿</div>
＿<div class="footer">
＿＿<h2>文書情報</h2>
＿＿<dl class="documentHistry">
＿＿＿<dt id="FIRST-PUBLISHED">First Published</dt>
＿＿＿<dd>2012-08-10</dd>
＿＿</dl>
＿＿<address>© ORUKA1951 2012 - 2016 All Rights Reserved mailto:*****</address>
＿</div>
</body>
</html>