HPのタグで、文章のみ白抜きは?
FCホームページ(以下FC2HPと略します)
を、試験的に旗揚げしたばかりで
今迄ブログは複数運営してますが
HPは作成が初めてです
それで、現在HTMLタグも勉強中なんですが
HP全体の背景に、自分がアップした画像を使用してます
但し、それでは文字が見え難い為
文字の周りだけ白抜きで表示させたいです
ただ、タグとしては
HTMLタグを使用して設定しました
その理由は、本来なら
スタイルシートの利用なんだと思いますが
そのスタイルシートの設定方法が分らない為
HTMLタグで使用しました
但し、ネットで検索すると
こういうHPの様に
http://www.homepage-tukurikata.com/hp/web.fc2.html
管理人が試験的に作ったスタイルシートは載ってます
しかし、どういう設定か迄は書いてなく
しかも、ネットで探すと管理人の考え(?)なのか?
複数の試験的スタイルシートを見掛けるんですが
意味が分からない為
これを応用して…と思っても出来ません
それで、現在設定してるタグは
下記の通りなんですが
背景の方は、解説してるHPの設定通りに
<body background="背景画像URL?" style="">
で設定しました
しかし、文字の周りの白抜きに関しては
みよう見真似と言うか
解説してるHPでの応用と考え
<font size="5" bgcolor="#FFFFFF">最初の見出し(?)タイトル</font>
と設定してみました
でも、当然ですが、付け焼刃で出来る訳も無い様で
全く反映しません
それで、現在の状況を画像で付けましたが
私が希望するのは、この状態で
漢字の「回」の字の様な感じが希望なんですが
要するに、今の状態はHP全体に画像が入ってます
それを画像は「回」の外側の「口」で
文章が「回」の内側の「口」に入る様に設定したいです
ちなみに、現在のタグは
下記の様に設定してます、宜しく御願いします
<html>
<head>
<title>タイトル</title>
</head>
<body background="背景画像URL?" style="">
<p></p>
<p></p>
<p></p>
<p></p>
<p><a href="ブログURL" target="_blank" title="ブログへ">ブログへ </a> <a href="UR
L" target="_blank" title="ルームへ">ルームへ </a></p>
<center>
<table border="3">
<tbody>
<tr>
<td><font size="5" bgcolor="#FFFFFF">最初の見出し(?)タイトル</font></td>
</tr>
</tbody>
</table>
</center>
<p></p>
<p>文章</p>
<p>文章</p>
<p>文章</p>
<p></p>
<p></p>
<p>文章</p>
<p><a href="ブログURL" target="_blank" title="ブログへ">リンク先へ </a> <a href="U
RL" target="_blank" title="ルームへ">リンク先へ </a></p>
</body>
</html>
No.1ベストアンサー
- 回答日時:
まず方法は2つあります。
(1)TABLEタグを用いて背景を指定する
(2)SPANタグを用いて文字に背景色を指定する
SPANタグは必要な文字のみ背景を付ける事が出来るので容易ですが、複数行に行うと行と行の間に隙間が出来てしまい、はっきり行って文章が見辛いです。
複数行の文章がまとめてある場合、TABLEタグで囲って背景を付けた方が見やすいです。
ただテーブルタグはちょっと必要な記載も多くなるので面倒…とまぁそれぞれの特徴があるので場合によって使い分けると良いでしょう。
SPANタグの例
<span style="background:背景色">文章</span>
TABLEタグの例
<table><tr><td bgcolor="背景色">文章</td></tr></table>
TABLEタグの場合<td bgcolor="背景色">とすればその1枠の中だけ、<table bgcolor="背景色">とすればテーブル全体の背景色を指定出来ます。
どのようなのが希望なのか説明が少々わかりにくかったので、
一応サンプル作ってイメージ画像も作っときました。添付画像参照。
上がTABLE、下がSPANです。
回答有難う御座います
結論から言うと解決しました
考えてみれば、サブタイトルにテーブルを使用してるんですから
そのテーブルで、バックに白を使用すれば出来たんですよね?…
それと、SPANタグの件も有難う御座います
この方法に関しても知ってましたが
この状態だと、言われる通り
見栄えが悪い場合が存在するんですよね…
No.3
- 回答日時:
No2の追加画像です。
ウルトラマンの画像が無かったのでこんなんで申し訳ありません。テーブルでの場合
<body background="背景画像URL" style="">
?
<table border="0"><tr><td><img src="作った白ふち画像URL" width="XXX" height="XXX" border="0"></td></tr></table>
回答有難う御座います
ただスイマセン…
結論から言うと、ナンバー1さんの回答の方が正解です
しかし、御指摘頂いた方法は
私自身、全然知らず
ある意味たなぼた的に勉強出来ました
今後使用させて頂きます
No.2
- 回答日時:
No1さんの方法が一般的にはそうですが、たぶんやりたい事は文字の枠を白くするのではなく、文字に影のように白ふちを付けたいのではと思いますが?
その場合は文字を白ふち付き画像として作り、貼り付けることが一般的です。
画像ソフト系の「文字ふちどり線」で作り方を調べて下さい。
背景の透過処理も必要と思います。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- PHP ここでの ②if($su_d<>"")の比較演算子 を使う理由は 1 2022/03/26 02:33
- HTML・CSS アコーディオンメニューが思うように動作しません。 1 2023/08/20 16:48
- PHP htmlspecialcharsが機能していないです。 バグですか? 1 2022/04/05 01:22
- Excel(エクセル) PHPプログラムをエクセルに張り付けると検索ボックスがでてくる! 3 2022/05/08 07:10
- HTML・CSS スクロールすると追従する画像のコードを書いているのですが、追従する画像の大きさの調節が上手くいきませ 2 2022/04/18 12:52
- HTML・CSS CSSでサイトの背景に画像を組み込みたいのですが反映されません 2 2022/11/22 16:21
- HTML・CSS 自身のHPにYouTube動画を貼り付けるのが出来なくなり困ってます 1 2022/11/11 10:44
- HTML・CSS htmltとcssの連携をして画像縮小について 1 2022/11/15 20:32
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
FC2ブログで、画像の画面中...
-
FC2ブログでCSS、HTMLについて
-
ブログの画像を中心におきたい...
-
楽天ブログで画像の右に回り込...
-
お絵かきBBSでアクセス解析(バ...
-
アメブロにスライドショー
-
バナー画像だけ表示されない・・・
-
ジュゲムのブログですが。。
-
画像の縦方向繰り返しタグ(右寄...
-
ビットマップ(bmp)形式で背景...
-
<td>中の文字列に<p>は必要?
-
HTML 表の上に文字がきてしま...
-
画像のペイントについて
-
編集が出来ません(JPEGフ...
-
サーブレット/JSPでブラウザの...
-
.jpg ってどうやって使うの?
-
このフォートナイトスキンの名...
-
アイコンとバナーの違いについて
-
アメブロcss 画像を好きな...
-
jw_cadをInkscapeで…
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
FC2ブログで、画像の画面中...
-
HTMLプログラミングについて
-
アメブロで画像が拡大表示でき...
-
画像の位置を変えるタグについ...
-
【HTMLタグ】画像を横に連...
-
楽天ブログで画像の右に回り込...
-
アメブロ サイドバーに動く画...
-
画像の外枠
-
バーナー自作??、著作権の質問...
-
【アメブロ】フリープラグイン...
-
ブログの画像を中心におきたい...
-
ブログで動く画像
-
画像リンクでの余白を消したい....
-
楽天アフィリエイトのHP作成...
-
FC2のバナーの設置について
-
楽天ブログで画像を横に並べて...
-
バナー画像だけ表示されない・・・
-
ホムペのタグについて
-
シーサーブログでタグのコピー...
-
ブログの画像を横並びにUPしたい
おすすめ情報