文字の入力1.文字の入力
2.改行
3.段落を変える
4.文字を太字にする
5.文字を斜体にする
6.文字の大きさを変える
7.文字に色を付ける
8.箇条書きにする
9.リストマークを挿入する
10文字の配置位置を揃える
11.インデントを使って段落を下げる
12.スペースの挿入
13.水平線を挿入する
14.「色の設定」ダイアログ（画面）で色を追加する。
文字の入力 |
標準 | <P></P> |
| 見出し1 | <H1></H1> | |
| 見出し2 | <H2></H2> | |
| 見出し3 | <H3></H3> | |
| 見出し4 | <H4></H4> | |
| 見出し5 | <H5></H5> |
文字の入力は、ワープロで文字を入力するのと同じです。カーソルが点滅している所にもじを入力することが出来ます。
ツールバーから使用する段落を選択します。既定は、「標準」になっています。
▼ボタンを押して使用する段落を選択してください。
選択した段落により下のようになります。
＜表示例＞
1.文字の入力
画面上にある
「HTMLソース」タブをクリックして、どのような「タグ」が付いているか見てみましょう。
上から、下のようなタグが文字の前後に付いています。
「htmlソース」
<P>1.文字の入力</P>
<H1>2.文字の入力</H1>
<H2>3.文字の入力</H2>
<H3>4.文字の入力</H3>
このように文字を入力しれば自動的に、タグが挿入されます。
タグを見るには、「HTMLソース」をクリックして確認することが出来ます。
次に、「プレビュー」タブをクリックすると、ブラウザ（インターネットエクスプローラーやネットスケープのこと）では、実際にどのように見えるかも確認することが出来ます。
以降、HPを作成する上で以上のような手順で、進めていって下さい。
文字の訂正、削除もワープロソフトの操作と同様に行えます。
又コピーや切り取り、貼り付けも同様の操作で行えます。
改行をする。＜BR＞「Enter」キーを押します。
文字を入力し、「enter]キーを押せば下の段に移動します。
ワープロソフトと同様ですね。
「ページ編集」画面では、下の画像のように改行した箇所に改行記号が表示されます。
「
」
又「htmlソースで見ると＜BR＞で表されます。
段落を変える下の画像の「青色の縦棒」のあたりをクリックしてカーソルを移動してから文字を入力します。
又は「Enter]キーを押します。
段落の区切りは、段落内の文字をクリックすると、下の画像のように、ピンク色枠で囲まれて表示され確認できます。
「htmlソース」で確認すると
<P>「Enter」キーを押します<BR>・・・・・・・中略・・・・・・・表されます。</P>
上記のように、<P></P>タグで囲まれていることが解りましたね。
文字を太字にする。<B></B>太字にする文字を選択後にツールバーにある
をクリックします。
左画像のように文字を選択して、をクリックします。
すると以下のようになります。
＜表示例＞
HPビルダーでホームページを作成する。
＜htmlソース＞
<P>HPビルダーで<B>ホームページ</B>を作成する。</P>
文字を斜体にする。斜体にする文字を選択後にツールバーにある
をクリックします。
＜表示例＞
HPビルダーでホームページを作成する。
＜htmlソース＞
<P>HPビルダーで<I >ホームページ</I >を作成する。</P>
文字の大きさを変える。<Font size=...>〜</Font>大きさを変える文字を選択後にツールバーにある
をクリックします。
左側の「A」をクリックすると大きくなります。
右側の「A」をクリックすると小さくなります。
＜表示例＞
HPビルダーでホームページを作成する。
HPビルダーでホームページを作成する。
＜htmlソース＞
<P>HPビルダーで<FONT size="+2">ホームページ</FONT>を作成する。</P>
<P>HPビルダーで<FONT size="-2">ホームページ</FONT>を作成する。</P>
上記のように「size=" "」の数値を直接変えて文字の大きさを変更することが出来ます。
文字に色を付ける。<Font color=#...>〜</Font>色を付ける文字を選択後にツールバーにある
をクリックします。
「カラーパレット」が表れます。
下の画像のように、「文字色」となっていることを確認してください。
好みの色をクリックしまう。
「適用」をクリックします。
＜表示例＞
HPビルダーでホームページを作成する。
HPビルダーでホームページを作成する。
＜htmlソース＞
<P>HPビルダーで<FONT color="#00ff00">ホームページ</FONT>を作成する。</P>
<P>HPビルダーで<FONT size="+2" color="#00ff00">ホームページ</FONT>を作成する。</P>
色指定の基本は、R赤G緑B青の光の三原色です。この組み合わせで色を指定します。
これらの色の指定は、16進法６桁のカラーコードです。
この場合「OO−FF−００」は、赤ー緑ー青の順になっています。
16進法とは、16ごとに桁が上がる記数法で、、
「0−1-2-3-4-5-6-7-8-9-a-b-c-d-e-f」を使い、00からFFまでの２桁で表します。
数字が小さいほど暗く、大きいほど赤るくなります。
具体的には
＃000000は黒で、＃FFFFFFは白になります。
箇条書きをする。<UL><LI>・・・</UL>又は<OL><LI>・・・</OL>箇条書きにする文字列を選択後に、ツールバーにある
をクリックします。
<htmlソース><UL><LI>HP作成入門1</UL>
<OL><LI>HP作成入門2</OL>
<DL><DT>HP作成入門3<DD>HPとは、・・・・</DL>
リストマークを挿入する。場面右にある「サイト・素材ビュー」の中に「リストマーク」があります。
このページでも既に何度も使用していますが、挿入の仕方は、挿入する所までドラッグ＆ドロップします。
＜表示例＞
HPビルダーでホームページを作成する。
＜htmlソース＞
<P><IMG src="b001lis.gif" width="16" height="16"
border="0">HPビルダーでホームページを作成する。</P>
●箇条書きと同様に、
リストマークを文章の先頭に入れることで、文字だけの画面にワンポイント、アクセントが出来、平坦なページにメリハリのが、出来ます。
●リストマークは、画像ですので、＜ｈｔｍｌ＞ソースには、
＜ＩＭＧ src="・・・"＞画像の挿入に使用するタグが使われます。
widthは画像の幅を表し、heightは、高さをを表します。
borderは、画像枠を表します。「０」の場合は、画像枠は非表示になります。
文字の配置位置を揃える 。align="left" align="center" align="right"文字を揃える段落にカーソルを移動します。
次に「ツールバー」にある
をクリックします。
左から「左揃え」「中央揃え」「右揃え」になります。
ここは左揃えです
ここは中央揃えです
ここは右揃えです。
<htmlソース><P align="left">ここは左揃えです</P>
<P align="center">ここは中央揃えです</P>
<P align="right">ここは右揃えです。</P>
インデントを使って段落を下げる。<BLOCKQUOTE>・・・</BLOCKQUOTE>「ツールバー」の中に「インデント」
があります。
段落を下げたい所にカーソルを移動して、をクリックします。
ここは、インデントを使って段落を下げました。
<htmlソース><BLOCKQUOTE>ここは、インデントを使って段落を下げました。</BLOCKQUOTE>
スペースの挿入文字の間に空白を挿入します。「キーボード」の」「スペースキー」を押して挿入します。
うまく挿入できない場合は、「メニューバー」「挿入」「特殊文字」をクリックし 、左上にある、「nbsp」をクリックします。
<htmlソース>
<P> </P>
水平線を挿入します。 <HR>水平線を挿入する位置にカーソルを置き、「ツールバー」から
「水平線」をクリックします。
<htmlソース> <HR>
●終了タグは必要ありません。
●簡単なタグですが、使う機会は多くあります。リストマーク同様に、ページにアクセントを付けてくれます。
ここから下の情報は、IBMオンラインサポートの資料を参照しています。
「色の設定」ダイアログで追加した色は、アプリケーションが起動している間しか保存されません。
「カラーパレット」へ色を登録することによって、追加した色を保存することができます。
操作手順
1.[表示]→[カラーパレット]を選択します。
2.「カラーパレット」で任意の色を選び、[登録]ボタンを押すと「色の設定」ダイアログが表示されます。
3.色を選択し[OK]ボタンをクリックすると、「カラーパレット」の下段へ色が追加されます。