FC2ブログ

ブログ・ホームページとHTML(画像・table)

ネットで内職お小遣い ブログで副業副収入 ~いざなみ宥和への道~
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
HTMLとは・・・

HTMLとはホームページ・Webページを作成するのに必要な文章構造を定義する言語です。
言語ですから決まり事があります。例えば日本語なら日本語の決まり事がありますよね。
先ずHTMLは決まり事のある言語である事を認識して下さい。

HTMLは下記の二通りに大別できます
1.インライン要素・・文章内の行の一部としてで使用される要素
          テキスト(強調strong他)
          スタイル(太字・イタリック体・下線他)
          リンク(<a・・他)・テーブル( <<table・・他)等
2.ブロックレベル要素・・ブロックで表される要素
            見出し(h1~h6)、段落、リスト、フォーム等

文字の強調・色の指定・table要素での表の作成等の要素を使用する事でホームページにメリハリが生まれます。
ブログにつてはそれほど必要有りませんがメリハリをつけるには必要な要素ですから少しずつ慣れていきましょう。(私も含めてです)

そうする事で重みがでて、アフィリエイトや副業・副収入を目指す良質なサイトになります。良質なサイトになればリピートが多くなる。
リピートが多くなると・・・・・・凄く期待!

管理人はHTML要素のことをHTML文字と呼んでいます。
今からはHTML要素=HTML文字として説明します。



HTML豆知識/画像作成・tableタグ

ブログにはブロックレベル要素を集約した便利なテンプレートがついていますのでインライン要素の豆知識です。

1.画像作成
FC2ブログでの画像作成で説明します

先ず表示させてい画像を選んで下さい
 他のホームページ・ブログにあるハートマーク等の画像をデスクトップに設置
 (FC2ブログでは記事作成の上部に絵文字の挿入等があり:利用して下さい)

デスクトップに設置した画像ファイルをFC2ブログにアップロード
 左サイドバー真ん中当たりツールのファイルアップロードを選択

ファイルアップロード管理画面に移動します
 表示させてい画像を選んで指示に従いアップロードします

アップロードするとファイル一覧にアップロードした画像が表示されます
その画像をクリックして下さい。画像画面に移動します。
画像画面の上部ブラウザに表示されているURLが画像のURLです。

この画像のURLを使用します(ここではハート画像を使用します)


表示には、imgタグを使用します
枠無し画像:<img src="画像のURL" alt="画像名" border="0" />で ➝ ハート画像
枠有り画像:<img src="画像のURL" alt="画像名" border="1" />で ➝ ハート画像 
     border="0"をborder="1"にしました
左に画像:<img src="画像のURL" alt="画像名" border="1" align="left" /> ハート画像 
右に画像:<img src="画像のURL" alt="画像名" border="1" align="right" />で ➝ ハート画像

画像にリンクしたい記事が有る場合
<img src="画像のURL" alt="ハート画像" border="0" />の前にリンクしたい記事のURLを記述して下さい
例えば管理人のトップページにリンクしたい場合は
<a href="管理人トッペジURL">
<img src="画像のURL" alt="画像名" border="0" /></a>
とすると
リンクした画像が表示されます ➝ ➝ ➝ ➝ ハート画像 



2.tableタグ 
table要素はhtml文字の表作成ツールと考えて下さい。
枠有り・枠無しに関わらず表作成に使用します。

<table>○○○○</table>でテーブルを定義します
<table>○○○○</table>の中に
 <td>○○</td>を記入する毎に横にセルが増えます
 <tr>○○</tr>を記入する毎に縦にセル(行)が増えます

テーブルの幅と高さを指定するにはwidth(幅)とheight(高さ)を使用します
     width="300" height="200(指定しなければ自動サイズ)
枠を指定するには table border="数字"を使用します
  枠無し表:table border="0"
  枠有り表:table border="1"・table border="2"・・・


<tableの作成>

<table border="1"
  <tr>
<td>セル1</td><td>セル2</td><td>セル3</td>
  </tr>
  <tr>
<td>セル4</td><td>セル5</td><td>セル5</td>
  </tr>
  </table>
  で作成すると
セル1セル2セル3
セル4セル5セル6
となります


幅と高さをwidth="100" height="20"で指定すると
セル1セル2セル3
セル4セル5セル6
となります
 <td>を全て<td width="100" height="20">に変更して下さい

簡単でしたがこれで初心者へのHTML文字の説明を終わります。
ブログ記事を作成するにはこと足りると思います。
今後HTML文字を少しずつ勉強していきましょう。







~ブログ ネットビジネス いざなみ宥和 ~

スポンサーサイト
この記事へのコメント
コメントを投稿する
URL:
Comment:
Pass:
秘密: 管理者にだけ表示を許可する
 
この記事のトラックバックURL
この記事へのトラックバック
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。