表の背景に画像を貼り付け

目次を作りました。順番に見てね


ブログで困ったこと
表の背景に画像を貼り付けたいのだが

表の大きさはwidth=120(横幅の指定) height=70(高さの指定)です。
この大きさに画像を貼り付けて、そして画像の上に言葉を入れたいのです。
準備として,泙魂菫を表の大きさ(背景の大きさ)にして保存してください。そして▲屮蹈鮎紊妊▲奪廛蹇璽匹靴堂爾気ぁこれで画像をアップする準備ができました。
画像の大きさの調整は、以前説明していますので、前のを見てください。
以前のアップ
画像がでかすぎる
画像サイズの調整

表に画像を入れる場合ですが、画像の大きさと表の大きさが一緒だと、全体的に少し枠全体が広がるみたいです。表の線の部分が画像と重なるので、私は画像を1又は2だけ小さくしています。
さて、背景の貼り付けですが、使うタグは background="画像のアドレス" です。
しかたとしては、まず表を作ります。そして表の大きさを指定します。
そして td 若しくは th の後に background="アドレス" を入れます。
<table border="1" cellspacing="1"><tr><td bgcolor="#00ffff" align="center" valign="top" width="120" height="70" background>ががにこにん</td></tr></table>
上記のようなタグを作ります。そんでもって backgroundの後にカーソルをもっていき「画像アップロード」をクリックして、画像を選びます。そうするとこんな感じになります。(これはじゅげむの場合です)<background<img src="http://・・・・・・・alt="" class="pict" />ががにこにん</td>
これでは画像として設定できないので、要らない部分を削除します。いらない部分は赤いところです。赤いところを削除するとこんな感じです。
<background="http://・・・・・・・alt="" class="pict" />ががにこにん</td>

ががにこにん






表の回り込み、表を横に3つ並べるには

目次を作りました。順番に見てね

回り込みを使って、ちょっとしたレイアウトを考えてみました。
まずは、回り込みの練習です。
画像をupします。その画像の右に文字を入れます。これはJUGEMのオンラインマニュアルに載っているとおりです。
<img src="http://・・・・・.jpg" の後に回りこみの指示を入れます。style=”float:left”/> 文字はここに入れます。下図ではこんな感じで・・・・という文です。そして最後に回り込み解除の指示を入れます。<br style="clear:both">です。これで回り込みが解除されます。

指示全体はこんな感じです。
<img src="http://・・・・・.jpg" style=”float:left”/>こんな感じでどう。回り込み成功<br style="clear:both"/>

こんな感じでどう。回り込み成功


 そんでもって下図のようにしたいと思って、いろいろやってみたらできました。方法はstyle="float:left"を利用しました。この指示は図を左に表示、文字を図の右に表示という意味のようです。まずは最初の表を作成するときにtableの指示のところに<table style="float:left">という指示を作ります。そうすると次の表が右側に表示されます。今度はその次の表にも同じように<table style="float:left">と入れて、またその次の表にも<table style="float:left">の指示を入れます。そうすると表が横一列に並びます。そして最後の表の指示の後に回り込み解除の指示<br style="clear:both">を付け足します。

表題1
行題1D
行題2D
行題3D
表題2
行題1D
行題2D
行題3D
表題3
行題1D
行題2D
行題3D

ん、とても満足。

ついでに回り込みを利用して目次も作成
目次を作りました。順番に見てね







画像上に文字を出す

目次を作りました。順番に見てね

画像上にポインターが移動したらメッセージ文字が出てくるようにするには
よく、よそのHPなどでポインターが画像上に移動すると、その画像の簡単な説明が出たりするがどうしてだろう?・・・・また、その画像の上に来るとポインターが手に変身してクリックすると他のHPへリンクしたりしますよね。どうしてかなぁ・・・・と思っていたら、アフリエイトをしていて発見。画像のアップは、画像のあるアドレスへ読み込みに行くようになっています。じゅげむならじゅげむの画像保管場所に、そうすると保管場所のアドレスが解かっていれば画像のアップは可能となりますね。画像のアップは<img src=”http://アドレス jpg”>ですが、これに画像上にポインターが来たときに文字が出るようにするは、<img src=”http://アドレス jpg”alt=”画像上にポインターが・・・”>というふうにalt=”・・・”とします。また、これとリンクを併用するには<a href=”http://・・・”target=”_blank”><img src=”http://アドレス jpg”alt=”画像上にポインターが・・・”></a>とします。これで画像上でのリンクと画像上でメッセージが出るようになりました。                

画像サイズの調整

目次を作りました。順番に見てね

画像の大きさを揃えたいのだが・・・・・
  
こんな場合は「ペイント」を使おう
「画像がでかすぎる」で画像の圧縮の仕方がわかりましたが、ツールの「変形」の下のほうに「キャンパスの色とサイズ」があります。これを利用すると画像の大きさ(サイズ)がわかります。私の場合は幅の最大で400程度を目安にしています。今頃、気がづいたのですが、最初から大きさを統一できるように、自分のサイズを決めておくといいのでは。

画像の処理が上手くいかない

目次を作りました。順番に見てね

発見、画像の処理での使いやすいソフトを見つけました。      ベクターのフリーソフトで3つばかりいいものがありました
一番目は切り抜きやぼかしなど加工がしやすいもので「軽快な画像レタッチソフト」です。
二番目がスキャナーで取り込んだ画像が綺麗になる「WaveleNR」です。
三番目が画像の斜めをまっすぐにしてくれるソフトで「こみこんぶ」です。
いずれもフリーソフトで使いやすいものでした。


画像がでかすぎる

目次を作りました。順番に見てね

写真や図を載せようとしたら、図が大きすぎて駄目でした。    こんなときは図を小さくしましょう。
使うのはパソコンの「ペイント」ソフトです。
ペイントを開き、図(写真)のファイルを開きます。
上部バーの「変形」をクリックすると「伸縮と傾き」があります。
そこで水平方向と垂直方向の倍率を設定します。
図の大きさによって縦と横の倍率を調整します。
長方形の図では、縦と横の倍率を同じにすると図が変形するので、縦と横の長さの比にあった倍率でするといいですよ。
これで私も上手くできました。




ブログで作図

目次を作りました。順番に見てね

なんとなく少しブログの書き方が上手くなったと感じるこの頃ですが「図」の入れ方がわからないよー。・・・そんな訳で色々した結果エクセルでできました。エクセルの「図形描写」機能(ツールバーのところで右クリックしたら出てきます)で「図表または組織図を挿入します」をクリックすると図表が出てくるので、そこで作図しました。後はファイルの保存で「ファイルの種類」を「webページ」を指定して保存します。できたファイルをブログの「画像の管理」でupすればできました。このときファイルはHTML(拡張子)とfiles(フォルダー)ができます。画像のファイルはfilesのホルダーの中にgifという画像の拡張子で、できています。                                     

表の作り方がわからない

目次を作りました。順番に見てね

ん〜、表の作成だけどまったく分からない??                目次
そうそう、ブログ検索で探しましょう。ブログで表作成・・・・・
「TAG」ホームページ作成を支援する・・・
なんか難しいけれどチャレンジ・・・てこずること2時間簡単な表ができました。
A-1A-2
b-1b-2

こんな感じで、ちょっと嬉しい楽しい

しかし、えらいっこちゃびっくり
文書と表が離れている???なぜ??格闘すること数日
解かった、表を作るタッグを改行せずに続けてタッグを書けばいいんだ。
超感激です。とても満足なり。

「TAG」は、色とか線とか結合とか色見本とか、HP作成支援のページです。まだ、私には分からん単語がいっぱいありますが、初めての方にも参考になると思います。因みにリンクフリーなのでサイドのリンクのところにTAGのホームにリンクするようにしときます。TAGさんありがとう。




画像がupされない

目次を作りました。順番に見てね

ブログを初めて3週間ぐらいたつのかな。そこで私がブログ作成で困ったことを書いていきますね。よっかたら参考にしてください。

画像がupできなかった。
初めてのときupの意味よくわからず(今でも不安だが)説明(オンラインマニュアル)をみてしたのでしたが,うまくいきませんでした。今はこんな感じでやっています。「画像管理」で一旦画像を取り込んでおきます。そして「記事の投稿」のところで文と文の間で、画像のアップロードでサムネイルから画像を選んでいます。画像のupってサムネイルにすることで、画像のアップロードで投稿できるんですね。
                        

calendar
1234567
891011121314
15161718192021
22232425262728
293031    
<< December 2019 >>
sponsored links
selected entries
categories
archives
recent comment
recent trackback
recommend
recommend
アメリカはなぜ「ガン」が減少したか―「植物ミネラル栄養素療法」が奇跡を起こす
アメリカはなぜ「ガン」が減少したか―「植物ミネラル栄養素療法」が奇跡を起こす (JUGEMレビュー »)
森山 晃嗣, Gary F. Gordon, ゲリー・F. ゴードン
ミネラルの大切さが解かります
recommend
免疫革命
免疫革命 (JUGEMレビュー »)
安保 徹
交感神経と副交感神経の関係がわかります。
links
profile
search this site.
others
mobile
qrcode
powered
無料ブログ作成サービス JUGEM