アセットパネル
アセットパネルでは、作業用フォルダの画像をプレビューしながら、ファイルを選択する事ができます。画像以外にもカラー、URL、FLASH、shockwave、ムービー、スクリプト、テンプレート、ライブラリなどをアセットパネルで扱う事ができます。
アセットパネルで画像を貼る方法
まずアセットパネルを選択しましょう。場所ですがファイルパネルの右隣にタブになって隠れている事が多いです。パネル中左側にボタンが縦に９個ぐらい並んでいて、今回は画像を選ぶので一番上のイメージボタンを押します。ファイル名の書いてあるリストが出てくるので選択しましょう。後はドラッグアンドドロップでファイルをデザインビューに持っていってもいいですし、挿入ボタンを押してもよいでしょう。どうしてもファイル名のわからない時は、一つファイル名をクリックして「↑」「↓」キーを押すとファイルのプレビューが切り替わってくれます。
アセットの意味
「アセット」といっても日本語ではあまりなじみのないという方も多いかもしれません。assetを英和辞典で調べると、資産や財産という意味なのだそうです。ボタンのTipsを表示するとわかるように、ライブラリやテンプレートなど、価値があって再利用できそうな素材がすぐに扱えるようになっています。言葉の響きからは、汗して作った素材もこの中にあるんだろうなという気もしてきます。失礼しました（笑）(^_^;)
広告
関連コンテンツ
画像の右に文字を入れる方法
通常画像を入れると文章は画像の下の行から続きますが、回り込ませる事もタグを工夫すれば可能です。どれもフロートが終わったら、フロートをクリアするという基本は一緒です。
HTMLで設定する場合
例
<p><img src="gazou.jpg" align="left"/>写真右文章
<br clear="left" />写真下文章</p>align=”left”で左にフロートしています。
br clearタグで左へのフロートを解除しています。
CSSで設定する場合
CSSの方が推奨されています。
・ CSSのコードの例
img.flt_left { float: left; }
.clr_left { clear: left; }左へのfloatと、それが終わった後clearするためのプロパティ設定をしています。
・ HTMLのコードの例
<p>
<img src="gazou.jpg" class="flt_left" />写真右文章
<div class="clr_left">写真下文章</div>
</p>やっている事はほとんどHTMLの場合と変わりはないです。CSSでの設定に手間がかかるぐらいでしょう。
画像を貼る方法
Dreamweaverではイメージの挿入ボタン・ファイルパネル・アセットパネルなど、画像を貼るための方法がいくつもあります。それでは、その時々に応じて使いやすい方法を選んでいきましょう。
イメージの挿入ボタン
画面右上の「挿入パネル」-「一般」-「イメージ」-「イメージ」の順で選択し、「イメージソースの選択」ダイアログを表示させます。後は画像を選んでOKを押します。
ファイルパネル
画面右下のファイルパネルで、貼りたい画像ファイルのアイコンをマウスでつかんでデザインビューに持っていくだけです。
マイコンピュータからコピペする方法
マイコンピュータやエクスプローラで画像を選択し、コピーアンドペーストするだけです。これが一番簡単でしょう。この方法でも、イメージフォルダの中に画像ファイルをコピーしてくれます。
アセットパネル
まずアセットパネルを選択しましょう。パネル中左側にボタンが縦に９個ぐらい並んでいますが、一番上のイメージボタンを押します。ファイル名の書いてあるリストが出てくるので選択しましょう。後はマウスでファイルをデザインビューに持っていってもいいですし、挿入ボタンを押してもよいでしょう。一番使用頻度は低いかもしれませんが、アセットパネルの存在と、イメージ以外にもテンプレートやライブラリなどを扱える事は覚えておきましょう。