ヘルプのインデックスへ戻る

ホスティングサービスJPホストをご契約いただくと、無料にてウェブ君コントロールパネルをご利用いただけます。
ウェブ君はブラウザからサーバにアクセスし、サイト管理、CGI作成、ホームページ編集が簡単に行える総合ツールです。
ウェブ君をご利用いただきたいお客様は、今すぐホスティングサービスJPホストにお申込み下さい。



ここでは、ホスティングサービスJPホストカスタマーの皆様方のためにウェブ君コントロールパネルの各種設定について、解説しております。
ウェブ君の各種設定、操作方法にて不明な点がある場合、このヘルプをご参照下さい。
ヘルプをご確認いただいても分からない場合は、下記メールにてお問い合せ下さい。

・技術的なお問い合わせ: techsupport@jphost.com
・一般的なお問い合わせ: info@jphost.com


ウェブ君ヘルプ

HTMLエディター

●目次

HTMLエディター(ウェブ君エディタ)とは

HTMLエディターの起動と終了
HTMLエディターを起動する
HTMLを編集する
編集したHTMLを保存する
HTMLエディターを終了する
HTMLエディターの機能概要
ワークエリア
メニューバー
ドキュメントウィンドウ
ステータスバー
コンテキストメニュー
プロパティウィンドウ
HTMLエディターの機能詳細
詳細表示とボーダー表示
オブジェクトのハイライト機能
「適用」ボタン
ページプロパティを設定する
変更を取り消す、またはやり直す
文字入力について
改行について
テキストのフォーマット
テキストをフォーマットする
太字、斜体、下線を設定する
フォント、フォントサイズ、色を変更する
形式
テキストの整列(左揃え、中央揃え、右揃え)
リストを作成する
段落および見出しタグを適用する
テキストプロパティの現状確認
タグにスタイルを設定し、テキストをフォーマットする
CSSスタイルシートを使用してテキストをフォーマットする
外部CSSスタイルシートを作成、リンクする
画像
画像を挿入する
画像のプロパティ
位置揃え
画像の表示サイズを変更する
ウェブ君カウンターの挿入
フォーム
フォームを挿入する
フォームにオブジェクトを挿入する
フォームのプロパティを設定する
テキストボックス
パスワード
ファイル
テキストエリア
チェックボックス
ラジオボタン
ドロップダウンリスト
リストボックス
送信ボタン
リセットボタン
イメージボタン
非表示ボックス
ボタン
テーブル
テーブルを挿入する
テーブルセルにコンテンツを入れる
テーブルを選択する
テーブルプロパティを設定する
セルのプロパティを設定する
行、列、セルを挿入、削除する
セルを分割、結合する
テーブルをネストする
リンク
リンクを作成する
パスの表記方法について
アンカーポイントにリンクする
リンクの種類
リンクをテストする
その他の機能
区切り線<HR>の挿入
コメントを挿入する(ウェブ君特有のコメントタグの説明)
オブジェクトを選択する
ユーザーインターフェイス
ユーザーインターフェイスでオブジェクトを編集する
テキストの選択
キーボードショートカット
動作
選択
編集
フォーマット
HTMLエディターがサポートしない範囲
ソースコードの編集
ソースコードエディタから直接入力するもの


●HTMLエディター(ウェブ君エディタ)とは

HTMLエディター(またはウェブ君エディタ)とは、HTMLの詳しい知識がなくてもホームページを作成、編集することができるソフトウェアです。
(DHTML(Dynamic HTML)ビルトイン・エディタ)
サーバーにアクセスしたまま、実際の画面でホームページを作成、編集することが可能です。
サーバー内のファイルを直接編集するのでアップロードする必要がありません。
保存してすぐにブラウザーで閲覧することができます。




ヘルプのインデックスへ戻る | このページのTOPに戻る↑


●HTMLエディターの起動と終了

■HTMLエディターを起動する
ウェブ君のファイルマネージャーで編集したいファイルをダブルクリックするか、ウェブ君の各CGIビルダーで「ウェブ君エディタ」ボタンを押すと、
そのファイルを読み込みながら起動します。
(ドキュメントは、「ウェブ君ファイルマネージャー」にて新規作成を行うか、「ウェブ君エディタ」ボタンを押したときに作成されます。)

■HTMLを編集する
HTMLエディターで、HTMLを編集します。

■編集したHTMLを保存する
HTMLを保存するには、メニューバーの「ファイル」の「保存」を選択して下さい。
ドキュメントの変更内容がファイルに保存されます。
CGIビルダーにおいては、この保存はHTMLファイルのメモリ上への保存であり、CGIに対する最終的な反映は「CGI作成」ボタンをクリックした時に行われます。

■HTMLエディターを終了する
メニューバーの「ファイル」から「終了」を選択するか、ウィンドウ右上のクローズボタンをクリックします。
「保存」せずに終了した場合、変更内容は破棄されます。

ヘルプのインデックスへ戻る | このページのTOPに戻る↑


●HTMLエディターの機能概要


■ワークエリア …(1)
HTMLエディターでのドキュメント作成はすべて、このワークエリアにて行います。
ワークエリアは、メニューバードキュメントウィンドウステータスバーから成っています。

■メニューバー …(2)
HTMLファイルの操作、オブジェクトの挿入、テキストの書式設定、テーブルの編集などの機能をもつボタンが並んでいます。

■ドキュメントウィンドウ …(3)
基本的にこのウィンドウをメインに作業することになります。
ドキュメントウィンドウには、HTMLがソースコードではなく、ブラウザで見ているように表示されます。
これによりユーザーはソースコードを直接編集することなく、実際の画面で作業を行うことができます。

■ステータスバー …(4)
ステータスバーに表示されるタグ「<BODY><TABLE>」をクリックするとそのタグのプロパティウィンドウが開きます。
ステータスバーに表示されるタグは、ドキュメントウィンドウのカーソル位置に対して有効なタグです。
(すべて開始タグで、終了タグ「</BODY>」などは表示されません。)

■コンテキストメニュー …(5)
ドキュメントウィンドウを右クリック(またはShift+F10キー)すると表示されるメニューを「コンテキストメニュー」といいます。
コンテキストメニューは、呼び出す位置によって表示される内容が少々異なります。

通常の場合は、

カット 選択範囲をクリップボードにコピーした後、削除します。
コピー 選択範囲をクリップボードにコピーします。
ペースト クリップボードにコピーした内容を、挿入位置に貼り付けます。
全て選択 ドキュメントウィンドウのすべてを選択します。
ページプロパティ ページのプロパティ(<BODY>タグのプロパティ)のウィンドウを開きます。
詳細表示 コメントやフォームなどの不可視オブジェクトを表示します。
ボーダー表示 ボーダー設定をしていないテーブルも、薄いラインで表示します。

が表示されます。

テーブルやボタンなどのオブジェクトを選択した状態からは、通常の場合に加えて
       
プロパティ 選択中のオブジェクトのプロパティウィンドウを開きます。
       
も表示されます。

テーブル内にカーソルを移動した状態からは、通常の場合に加えて、

セルプロパティ テーブルのセルのプロパティウィンドウを開きます。
テーブルプロパティ テーブルのプロパティウィンドウを開きます。
行挿入 現在の行の位置に、新しい行を挿入します。
行削除 現在の行を削除します。
列挿入 現在の列の位置に、新しい列を挿入します。
列削除 現在の列を削除します。
セル挿入 現在のセルの位置に、新しいセルを挿入します。
セル削除 現在のセルを削除します。
セル結合 選択中のセル同士を結合します。
セル分割 選択中のセルを分割します。
   
も表示されます。

■プロパティウィンドウ


<BODY>タグのプロパティ(ページプロパティ)

コンテキストメニューからプロパティを選択するか、ステータスバーでタグをクリックすると、プロパティウィンドウが開きます。
プロパティウィンドウから、タグの設定(基本設定、スタイルの設定、イベント設定、拡張設定など)ができます。
※プロパティウィンドウで複数の設定をした場合、変更確定後、メニューバーの「元に戻す」ボタンで作業を戻すときは複数回戻さなければ、
変更前の状態になりません。これは、「元に戻す」ボタンでは、一つずつしか作業を元に戻せないために起きる現象です。

●HTMLエディターの機能詳細

■詳細表示とボーダー表示
HTMLエディターの便利な機能に、「詳細表示」と「ボーダー表示」があります。
        「詳細表示」と「ボーダー表示」の設定は、右クリックをすると表示されるコンテキストメニューで変更します。
※チェックが付いている状態がONで、チェック無しはOFFです。

「詳細表示」にチェックを付けると、コメントタグ(<!-- -->)やフォームタグ(<FORM></FORM>)などの通常ブラウザでは表示されないタグ(不可視オブジェクト)を(   )のように表示することができます。
これにより、よりフォームなどの編集が簡単になります。

「ボーダー表示」にチェックを付けると、実際には見えない状態のテーブル編集が容易にできるよう、薄いラインで表示されるようになります。

■オブジェクトのハイライト機能
ステータスバーに表示されるタグ(<BODY><TABLE>)を右クリックすると、ボタンを押している間、そのタグのオブジェクトがハイライト表示されます。
タグの位置確認や、構成などを理解するのに役立ちます。

■「適用」ボタン
プロパティウィンドウなどで設定を変更した後、「適用」ボタンをクリックすると、ウィンドウを閉じることなく設定の変更を確定します。
※「適用」ボタンで確定した後「キャンセル」ボタンをクリックしても、変更された内容は元に戻りません。
変更された内容を元に戻すには、「元に戻す」ボタンを使用して下さい。

■ページプロパティを設定する
コンテキストメニュー」の「ページプロパティ」、またはステータスバー<BODY>タグのクリックから、ページプロパティの設定を行います。


ページタイトル ページタイトルを指定します。HTMLでの<TITLE>タグの値です。ウインドウタイトルです。
背景色 背景色を指定します。
テキスト テキスト色を指定します。
リンク リンクの色を指定します。
訪問済みリンク 訪問済みリンクの色を指定します。
アクティブリンク 選択中のリンクの色を指定します。
背景画像 背景の画像を指定します。
左余白 左の余白をピクセル単位で指定します。
右余白 右の余白をピクセル単位で指定します。
上余白 上の余白をピクセル単位で指定します。
下余白 下の余白をピクセル単位で指定します。


■変更を取り消す、またはやり直す
現在の作業を一つ前の段階に戻します。
変更を取り消すには、メニューバーの「元に戻す」ボタンをクリックするか、CTRL+Zを押して下さい。
また、「元に戻す」ボタンで一度戻した作業をまたやり直すには、メニューバーの「やり直し」ボタンをクリックするか、CTRL+Yを押して下さい。
ボタンクリックが不可能な状態は、それ以前の状態に戻せない、またはそれ以降の作業をやり直せないことを意味します。

※「ボディーソースを編集」など、操作により、実行すると「元に戻す」ボタンが効かなくなるものがありますので、ご注意ください。

■文字入力について
文字を入力するには、カーソルが文字入力カーソル(I字型)になっている必要があります。

■改行について
Enterキーを押すと<P></P>タグによる改行ができます。
Shift+Enterキーで、<BR>タグによる改行ができます。こちらのほうが行間隔が狭くできます。


ヘルプのインデックスへ戻る | このページのTOPに戻る↑


●テキストのフォーマット

■テキストをフォーマットする
メニューバー上段真ん中あたりに、テキストのフォーマットをするボタンがあります。

■太字、斜体、下線を設定する
変更したいテキストを選択し、メニューバーの「太字」、「斜字体」、「下線」ボタンをクリックします。

■フォント、フォントサイズ、色を変更する
変更したいテキストを選択し、メニューバーの「フォント」ボタンをクリックします。
フォント設定ウィンドウが開きます。
変更したい項目を変更し、「OK」ボタンで変更を確定します。
色は、「色番号」項目に直接色を指定することもできます(RGBの16進数表記 "#FF0000"など)。
同時に太字、斜体、下線も設定できます。

■形式
書式付き<PRE>、アドレス<ADDRESS>、ディレクトリリスト<DIR>、メニューリスト<MENU>、用語<DT>、定義<DD>、段落の設定<P>

■テキストの整列(左揃え、中央揃え、右揃え)
整列したいテキストの行(テーブル内ならセル)にカーソルを移動し、メニューバーから「左揃え」、「中央揃え」、「右揃え」ボタンのいずれかを
クリックします。
オブジェクトもこれと同様の方法で整列できます。

■リストを作成する
リストにしたいテキストを選択し、メニューバーから「番号付きリスト」または「番号無しリスト」ボタンをクリックします。
       

■段落および見出しタグを適用する

■テキストプロパティの現状確認
フォーマットが適用されているテキストにカーソルを移動すると、適用されているフォーマットのボタンが選択状態(ON)になります。

■タグにスタイルを設定し、テキストをフォーマットする
フォーマットしたいテキストを含むタグのプロパティウィンドウを開きます。
ウィンドウの「スタイル」をクリックし、「--プロパティ--」と表示されたドロップダウンリストから、設定したいスタイルを選択します。
次に、右の矢印ボタンをクリックし、スタイルの値を指定します。
「OK」ボタンをクリックし、スタイルの設定を確定して下さい。

■CSSスタイルシートを使用してテキストをフォーマットする
メニューバーの「ファイル」から、「全てのソースを編集」を選択します。
HTMLのヘッダー部分(「<HEAD>〜</HEAD>」)にスタイルタグ(「<STYLE>〜</STYLE>」)を追加します。

例:
<HEAD>
 <STYLE TYPE="text/css">
  <!--
   H1 {color:red;}
  -->
 </STYLE>
</HEAD>

このように記述すると、見出し1(「<H1>〜</H1>」)タグのテキストの色が赤く表示されます。

■外部 CSS スタイルシートを作成、リンクする

メニューバーの「ファイル」から、「全てのソースを編集」を選択します。
HTMLのヘッダー部分(「<HEAD>〜</HEAD>」)にリンクタグ(「<LINK>」)を追加します。

例:(同ディレクトリの「test.css」ファイルにリンクする)
<HEAD>
 <LINK REL=STYLESHEET TYPE="text/css" HREF="test.css">
</HEAD>

このように記述すると、見出し1(「<H1>〜</H1>」)タグのテキストの色が赤く表示されます。
※CSSスタイルシートと、プロパティウィンドウの「拡張設定」にてクラスを指定し、関連づけることもできます。

例:
「プロパティ」項目に「class」 「値」項目に「redclass」 と指定すると、CSSスタイルシートの「redclass」クラスを参照します。



ヘルプのインデックスへ戻る | このページのTOPに戻る↑

 


●画像

HTMLエディターは、JPEG、GIF、PNGといった形式のイメージを表示することができます。

画像形式

JPEG 写真などを扱うのに優れている形式です。
GIF 非連続トーンのイメージや広範囲に均一カラーを適用したものを扱うのに優れた形式です。
PNG インデックスカラー、グレイスケール、トゥルーカラーのサポートを含む特許使用料の不必要な形式です。
また、透過のアルファチャンネルもサポートしています。


■画像を挿入する

ページに画像を挿入するには、メニューバー上段右の「画像ファイルの挿入」ボタン、あるいは「画像ファイルの挿入ダイアログ」ボタンを使用します。

画像ファイルの挿入


「画像ファイルの挿入」ボタンをクリックすると、IMGタグのプロパティウィンドウが表示されます。
「ソース」の右側の三角ボタン から「開く」をクリックし、ファイル名を取得します。
「OK」ボタンをクリックし、画像を挿入します。



画像ファイルの挿入ダイアログ



「画像ファイルの挿入ダイアログ」ボタンをクリックすると、画像ファイルの挿入ダイアログが表示されます。
(もう一度ボタンをクリックすると、ダイアログが非表示になります)
ツリー表示されたディレクトリの中から、挿入したい画像の入っているディレクトリをクリックします。
右側に選択したディレクトリ内の画像ファイルのプレビューが表示されます。
挿入したいファイルのプレビューをドキュメントウィンドウに移動(ドラッグ&ドロップ)して下さい。
移動(ドラッグ&ドロップ)した画像がドキュメントウィンドウに挿入されます。



■画像のプロパティ

ソース ファイルのパスを入力して下さい。
代替 画像が表示されなかったときに表示される文字を入力します。
名前 この画像の名前を入力します。
行揃え 画像に対するテキストの配置を指定します。
枠線の太さ 画像の外枠の太さを設定します。枠を表示したくない場合は、0を入力して下さい。
画像の横幅を指定します。(ピクセル単位)
高さ 画像の縦幅を指定します。(ピクセル単位)
横余白 画像の横の余白を指定します。(ピクセル単位)
縦余白 画像の縦の余白を指定します。(ピクセル単位)
ロック チェックを入れると、画像の縦横比を固定します。
(幅の値を変更すると、高さの値も自動的に変更されます。)


■位置揃え
「位置揃え」には、画像に対するテキストの配置を指定します。

■画像の表示サイズを変更する
画像プロパティの「幅」と「高さ」の数値を変更して、画像の表示サイズを変更することが可能です。
この画像の表示サイズを変更しても実際のファイルのサイズ(容量)は変更されません。
画像ファイル自体のサイズを変更したい場合は、外部の画像編集ソフトウェアなどを使用して下さい。

■ウェブ君カウンターの挿入
HTMLエディターは、簡単にウェブ君カウンターファイル(.wkc)を挿入することができます。
ウェブ君カウンターを挿入するには、メニューバーの「画像ファイルの挿入」ボタンをクリックします。
次に「ソース」項目の横の右向き三角ボタンをクリックし、「ウェブ君カウンタを開く」を選択して下さい。
作成したウェブ君カウンターファイル(.wkc)などが一覧で表示されます。
挿入したいカウンターを選択し、「OK」ボタンをクリックしてカウンターを挿入して下さい。


ヘルプのインデックスへ戻る | このページのTOPに戻る↑


●フォーム

フォームを使うと、ユーザーの入力データを取得することができます。

■フォームを挿入する
フォームタグは、メニューバーの「送信ボタンの挿入」などによって、フォームタグが必要なオブジェクトが挿入されたとき、自動的に挿入されます。

■フォームにオブジェクトを挿入する
フォームにオブジェクトを挿入するには、まず、フォームタグを実際に目で確認できるよう、「詳細表示」にチェックを入れておきます。
次に、フォームの開始タグと終了タグの間にカーソルを移動し、メニューバーのボタンでオブジェクトを挿入します。
フォームのオブジェクトを挿入するボタンは、メニューバー下段の左の方に並んでいます。

■フォームのプロパティを設定する
フォームタグの内側にカーソルを移動し、ステータスバー<FORM>タグをクリックして下さい。
フォームのプロパティが表示されます。

名前 このフォームの名前を入力して下さい。JavaScriptやVBScriptなどで、フォームの制御ができるようになります。
実行時の動作 ボタンがクリックされたときなどの動作を処理するプログラムのパスを指定して下さい。
データ送信形式 データ送信形式(GETやPOST)を選択して下さい。
エンコード形式 文字エンコードのタイプなどを入力して下さい。
ターゲット リンク先の内容、またはフォームの結果をどのウィンドウ(フレーム)に表示するかを指定します。

※GET
サーバーにフォームデータを送信する際に、URLにデータを追加して、GETメソッドを要求します。
フォームのデータをURLに追加して、サーバにGETメソッド要求ヘッダを送信します。

※POST
サーバーにフォームデータをメッセージの本文として送信します。POSTメソッドを要求します。
フォームが長いときにはこちらを使ったほうが良いでしょう。


■テキストボックス
メニューバーの「テキストボックスの挿入」ボタンで挿入します。
アルファベット、数字などのテキストを入力します。

タイプ テキストボックスが指定されています。
名前 このテキストボックスの名前を指定します。
初期値 フォームが最初に読み込まれるときにボックス内に表示される文字を指定します。
文字幅 テキストボックスで表示できる文字数を指定します。
最大文字数 テキストボックスに入力できる最大文字数を指定します。


■パスワード
メニューバーの「パスワードの挿入」ボタンで挿入します。
パスワードを入力します。入力したパスワードは画面上、アスタリスク(*)で表示されます。

タイプ 「パスワード」が指定されています。
名前 このパスワードボックスの名前を指定します。
文字幅 パスワードボックスで表示できる文字数を指定します。
最大文字数 パスワードボックスに入力できる最大文字数を指定します。


■ファイル
メニューバーの「ファイルの挿入」ボタンで挿入します。
ローカルのファイルを参照し、フォームデータをアップロードできるようになります。

タイプ 「ファイル」が指定されています。
名前 ファイル送信ボックスの名前を指定します。
文字幅 ファイル送信ボックスで表示できる文字数を指定します。


■テキストエリア
メニューバーの「テキストエリアの挿入」ボタンで挿入します。
アルファベット、数字などの複数行のテキストを入力します。

名前 テキストエリアの名前を指定します。
表示行数 テキストエリアの表示行数を指定します。
横幅 テキストエリアの横幅を指定します。
折り返し 入力文字数が横幅を超える場合の改行方法を指定します。
[SOFT]
 画面表示は自動改行し、送信データは自動改行しない。
[HARD]
 画面表示、送信データとも自動改行する。
[しない]
 自動改行しない。


■チェックボックス
メニューバーの「チェックボックスの挿入」ボタンで挿入します。
1つのグループ内で複数の回答ができるようにします。

タイプ 「チェックボックス」が指定されています。
名前 チェックボックスの名前を指定します。
チェックボックスをチェックしたときの値を指定します。
チェック済み フォームが最初に読み込まれるときにチェックします。


■ラジオボタン
メニューバーの「ラジオボタンの挿入」ボタンで挿入します。
グループ内で1つだけ選択が可能です。ボタンを一つ選択すると、グループ内の他のボタンのチェックは解除されます。

タイプ 「ラジオボタン」が指定されています。
名前 ラジオボタンの名前を指定します。
ラジオボタンをチェックしたときの値を指定します。
チェック済み フォームが最初に読み込まれるときにチェックします。


■ドロップダウンリスト
メニューバーの「ドロップダウンリストの挿入」ボタンで挿入します。
単一選択させるときに使います。
選択肢は、右端の下向き三角を押したときに展開、表示されます。

名前 ドロップダウンリストの名前を指定します。

リスト

クリックしたときの値を指定します。
表示文字 リストに表示される文字を指定します。

リストの追加
 「値」と「表示文字」を入力し、「追加」ボタンをクリックします。

リストの変更
 変更するリストを選択し、「値」と「表示文字」を変更し、「変更」ボタンをクリックします。

リストの削除
 削除するリストを選択し、「削除」ボタンをクリックします。

リストのリセット
 「リセット」をクリックすると、リストがすべて削除されます。

■リストボックス
メニューバーの「リストボックスの挿入」ボタンで挿入します。
複数選択させるときに使います。
画面に表示される選択肢は複数行で、スクロールさせることができます。

名前 リストボックスの名前を指定します。
表示行数 リストボックスの表示行数を指定します。
複数選択 複数選択が可能かどうかチェックします。

リスト

クリックしたときの値を指定します。
表示文字 リストに表示される文字を指定します。

リストの追加
 「値」と「表示文字」を入力し、「追加」ボタンをクリックします。

リストの変更
 変更するリストを選択し、「値」と「表示文字」を変更し、「変更」ボタンをクリックします。

リストの削除
 削除するリストを選択し、「削除」ボタンをクリックします。

リストのリセット
 「リセット」をクリックすると、リストがすべて削除されます。

■送信ボタン
メニューバーの「送信ボタンの挿入」ボタンで挿入します。
フォームデータをプログラムへ送信します。

タイプ 「送信ボタン」が指定されています。
名前 送信ボタンの名前を指定します。
ボタンのラベルを指定します。初期値は「Submit」になっています。


■リセットボタン
メニューバーの「リセットボタンの挿入」ボタンで挿入します。
フォームデータをリセットします。

タイプ 「リセットボタン」が指定されています。
名前 リセットボタンの名前を指定します。
ボタンのラベルを指定します。初期値は「Reset」になっています。


■イメージボタン
メニューバーの「イメージボタンの挿入」ボタンで挿入します。
ボタンの代わりにイメージを使用できます。

タイプ 「イメージ」が指定されています。
ソース 表示する画像のパスを指定します。
名前 イメージボタンの名前を指定します。
代替 イメージが表示されないとき、代わりに表示するテキストを指定します。
行揃え 画像の横位置を指定します。
画像の幅をピクセル単位で指定します。
高さ 画像の高さをピクセル単位で指定します。


■非表示ボックス
メニューバーの「拡張」から「非表示ボックスの挿入」を選択し、挿入します。
ユーザー側には表示されない、プログラムが使用するフォームデータを保管します。

タイプ 「非表示ボックス」が指定されています。
名前 非表示ボックスの名前を指定します。
初期値 データを指定します。


■ボタン
メニューバーの「拡張」から「ボタンの挿入」を選択し、挿入します。
送信、リセット以外の処理を行わせるときに使います。(送信、リセットと同様の処理をさせることも可能です。)

タイプ 「ボタン」が指定されています。
名前 ボタンの名前を指定します。
ボタンのラベルを指定します。初期値は「クリック」になっています。



ヘルプのインデックスへ戻る | このページのTOPに戻る↑


●テーブル

テキストやイメージを表形式で配置するためのオブジェクトです。
テーブルに関連するボタンはメニューバーの下段右にあります。

■テーブルを挿入する
メニューバーの「表の挿入」ボタンをクリックして下さい。
横3×縦3のテーブル(表)が挿入されます。

■テーブルセルにコンテンツを入れる
挿入されたテーブルのセルをクリックすると、セルにカーソルが移動されます。
この状態で作業を行って下さい。

■テーブルを選択する
テーブルの枠をクリックするとテーブル全体が選択されます。
(表示されていない場合はボーダー表示にチェックを付けて下さい。)

■テーブルプロパティを設定する

横位置揃え テーブルの位置を指定します。(指定なし、左、中央、右)
テーブルの幅をピクセル単位、またはパーセントで指定します。
高さ テーブルの高さをピクセル単位、またはパーセントで指定します。
セル間隔 セルとセルとの間隔をピクセル単位で指定します。
セル余白 セルとセル内の文字の余白をピクセル単位で指定します。
線の太さ テーブルの線の太さをピクセル単位で指定します。
背景色 テーブルの背景色を指定します。



■セルのプロパティを設定する

横位置揃え セル内文字の横位置を指定します。(指定なし、左、中央、右)
縦位置揃え セル内文字の縦位置を指定します。(指定なし、上、中央、下)
列範囲 何列分のセルを一つにするのか(COLSPAN)を指定します。
行範囲 何行分のセルを一つにするのか(ROWSPAN)を指定します。
セルの幅をピクセル単位、またはパーセントで指定します。
高さ セルの高さをピクセル単位、またはパーセントで指定します。
折り返さない セル内の文字を折り返しません。
背景色 セルの背景色を指定します。

■行、列、セルを挿入、削除する

■セルを分割、結合する

■テーブルをネストする
テーブルの中にテーブルを配置することを、テーブルのネストといいます。
テーブルをネストするには、テーブルを挿入するセルにカーソルを移動します。
メニューバーの「表の挿入」ボタンをクリックし、テーブルを挿入して下さい。
セルの中にテーブルが作成されます。


ヘルプのインデックスへ戻る | このページのTOPに戻る↑


●リンク

ドキュメントやイメージ、マルチメディアファイル、またはダウンロード可能なプログラムにハイパーリンクを設定できます。

■リンクを作成する
リンクを貼るテキストやオブジェクトを選択して、メニューバー上段右の「リンクの挿入」ボタンをクリックします。
「ハイパーリンク」ウィンドウが表示されますので、「リンクの種類」を選択し、URLを指定します。
「OK」ボタンをクリックすると選択範囲にリンクが適用されます。
または、直接「ソース編集」から<A>タグを挿入します。

■パスの表記方法について
パスには次の3種類あります。

絶対パス リンクされたドキュメントの完全なURLアドレス。
例:
http://www.jphost.com/info/webkun/info.html など)
相対パス 現在のドキュメントから、リンク先のドキュメントまでのパス。
例:
http://www.jphost.com/info/)から
http://www.jphost.com/info/webkun/info.html)にリンクする場合。
webkun/info.html)となります。 
ルート相対パス ルートディレクトリ(http://www.jphost.com/)からドキュメントまでのパス。
/」から書き始めるとルート相対パスになります。
例:
/info/webkun/info.html など)  


■アンカーポイントにリンクする
「ソース編集」からHTMLコードを開き、アンカーポイントを挿入する個所に「<A NAME="アンカーポイントの名前"></A>」を入力します。
「OK」ボタンをクリックし、アンカーポイントの追加を確定します。
次に、アンカーポイントにリンクします。
<A HREF="#アンカーポイントの名前"></A>

■リンクの種類

電子メールリンク 「リンクの種類」から「mailto:」を選択し、URLに表示されている「mailto:」の後にメールアドレスを指定します。
ヌルリンク ヌルリンクとは、何も指定されていない空のリンクのことです。
「リンクの種類」から「その他」を選択し、URLに「#」と入力します。
スクリプトリンク スクリプトリンクとは、JavaScriptコードの実行や、JavaScript関数などを呼び出すものです。
例:
(「リンクの種類」から「その他」を選択し、URLに「javascript:alert('Hello!')」と入力)


■リンクをテストする
実際にブラウザで編集したページを表示し、リンクのチェックを行って下さい。


ヘルプのインデックスへ戻る | このページのTOPに戻る↑


●その他の機能

■区切り線<HR>の挿入
水平の線を挿入し、文章やオブジェクトなどを区別することができます。
区切り線の挿入方法は、メニューバー下段左の「区切り線の挿入」ボタンをクリックします。
カーソルの位置に区切り線が挿入されます。

■コメントを挿入する(ウェブ君特有のコメントタグの説明)



ヘルプのインデックスへ戻る | このページのTOPに戻る↑

 


●オブジェクトを選択する

ページ上のオブジェクトを編集する為には、最初にオブジェクトを選択しなくてはなりません。
基本的に選択可能なオブジェクトには2種類あります。


1.直接選択することができるオブジェクト(イメージ、テーブル、コントロールなど)

2.一群のテキストとして選ばれるオブジェクト(オブジェクトがテキスト選択の範囲内に含まれるときに選択され、テキストとみなされる)


■ユーザーインターフェイス

テキストを表示している直接選択可能なオブジェクトはユーザーインターフェイスの起動をサポートしています。
これはオブジェクトのテキストを直接編集することができるモードです。
このモードを使用すると、オブジェクトのプロパティを開くことなく、表示されているテキストを直接編集することができます。
※もちろんオブジェクトのプロパティを開いて編集することも可能です。

■ユーザーインターフェイスでオブジェクトを編集する

1.オブジェクトの上にポインターを持っていき、移動ポインター()に変わったら、クリックします。

またはTAB(タブ)キーでオブジェクトを選択します。
オブジェクトは、以下のように選択された状態になります。





2.オブジェクトの上にポインターを持っていきクリックすると、文字入力ポインター(I字型)に変わります。

オブジェクトは以下のように選択された状態になり、文字入力カーソルが挿入されます。
この状態で直接入力し、オブジェクトを編集することができます。




■テキストの選択

テキストをドラッグ ドラッグしたテキストが選択されます。
選択境界線を越えてドラッグすると、全てのテキストを選択します。
SHIFT+クリック カーソル挿入位置からポインターの間のテキストが選択されます。
ダブルクリック 1単語を選択します。
その後ドラッグすると全てのテキストを選択します。
トリプルクリックまたは
CTRL+ダブルクリック
1節を選択します。
その後ドラッグすると全ての節を選択します。
テキストを選択して
ドラッグ
選択されたテキストを移動します。



ヘルプのインデックスへ戻る | このページのTOPに戻る↑



●キーボードショートカット

HTMLエディターは、以下のキーボードショートカットをサポートします。

■動作

カーソルが1文字(または1つのオブジェクト)ずつ右方向へ移動します。
カーソルが1文字(または1つのオブジェクト)ずつ左方向へ移動します。
CTRL+→ カーソルが1単語(または1つのオブジェクト)ずつ右方向へ移動します。
CTRL+← カーソルが1単語(または1つのオブジェクト)ずつ左方向へ移動します。
カーソルが1行ずつ下方向へ移動します。
カーソルが1行ずつ上方向へ移動します。
END カーソルが現在の行の終わりまで移動します。
HOME カーソルが現在の行の始めまで移動します。
CTRL+↓ カーソルが1節ずつ下方向へ移動します。
CTRL+↑ カーソルが1節ずつ上方向へ移動します。
PAGE DOWN カーソルが1ページずつ下方向へ移動します。
PAGE UP カーソルが1ページずつ上方向へ移動します。
CTRL+HOME カーソルが文書の始まりまで移動します。
CTRL+END カーソルが文書の終わりまで移動します。
TAB コントロールオブジェクトを順番にブロックレベルで選択していきます。
SHIFT+TAB コントロールオブジェクトを逆の順番にブロックレベルで選択していきます。


■選択


SHIFT+→ カーソルから1文字(または1つのオブジェクト)ずつ右方向へ選択していきます。
SHIFT+← カーソルから1文字(または1つのオブジェクト)ずつ左方向へ選択していきます。
CTRL+SHIFT+→ カーソルから1単語(または1つのオブジェクト)ずつ右方向へ選択していきます。
CTRL+SHIFT+← カーソルから1単語(または1つのオブジェクト)ずつ左方向へ選択していきます。
SHIFT+↑ カーソルから1行ずつ上方向へ選択していきます。
SHIFT+↓ カーソルから1行ずつ下方向へ選択していきます。
SHIFT+END 現在の行の終わりまで選択します。
SHIFT+HOME 現在の行の始まりまで選択します。
SHIFT+PAGE DOWN 下方向へ1ページずつ選択していきます。
SHIFT+PAGE UP 上方向へ1ページずつ選択していきます。
CTRL+SHIFT+END 文書の終わりまで選択します。
CTRL+SHIFT+HOME 文書の始まりまで選択します。
CTRL+A すべて選択します。


■編集

BACKSPACE カーソルの左側、または選択範囲を削除します。
CTRL+BACKSPACE カーソルから左側をスペースまで削除します。
選択されている場合は、選択範囲を削除し、スペースまでカーソルを移動します。
CTRL+C 選択範囲をクリップボードへコピーします。
CTRL+V 現在の位置へクリップボードの内容をペースト(貼り付け)します。
CTRL+X 選択範囲をクリップボードへコピーし、選択範囲を削除します。
DELETE 選択範囲を削除します。
INSERT テキストへの挿入、上書きモードを切り換えます。
CTRL+Z 作業を1つ前の段階に戻します。
CTRL+Y 作業を1つやり直します。
CTRL+F 文書内のテキストを検索します。
SHIFT+F10 右クリックメニューを表示します。
CTRL+L 選択した範囲にハイパーリンクを挿入します。
カーソルの挿入点が<A>タグの範囲内ならば、ハイパーリンクプロパティを表示します。


■フォーマット

CTRL+B 太字の設定を切り換えます。
CTRL+I イタリックの設定を切り換えます。
CTRL+U 下線の設定を切り換えます。
CTRL+T インデントを設定します。
CTRL+SHIFT+T インデントを解除します。



ヘルプのインデックスへ戻る | このページのTOPに戻る↑

   

●HTMLエディターがサポートしない範囲

HTMLエディターがサポートする範囲は以上です。
それ以外の作業は、直接テキストコードを編集して下さい。

■ソースコードの編集
ソースコードを編集するには、メニューバーの「ファイル」から、「ボディソースを編集」、または「全てのソースを編集」をクリックします。

ソースコードを直接入力することで、細かいところまで作成・編集することができます。
作成・編集作業が完了したら、「OK」ボタンで変更内容を確定して下さい。
ソースコード編集の種類は2つあります。

■ソースコードエディタから直接入力するもの



JPホストなら「ウェブ君」が無料(フリー)で利用できる!

お問合せは・・・

    info@jphost.com


Copyright(C)2002 GNA, Inc. All Rights Reserved