KENスクールブログ | パソコン教室・パソコン講座なら個別指導のKENスクール

BLOGKENスクールブログ

  1. KENスクール TOP >
  2. KENスクールブログ > Web・DTPデザイン > Dreamweaver CC2014のライブビューを活用する

Web・DTPデザイン

Dreamweaver CC2014のライブビューを活用する

KENスクールONLINE

今回はDreamweaver CC2014でライブビューを活用する一例をご紹介したいと思います。

Dreamweaver CC2014では、ライブビューで直接編集ができるようになりました。

Dreamweaverのライブビューでは、webkitと同じプレビューが可能ですので、デザインビューより正確なコーディングが行えます。

 

下の図のように、[挿入パネル]→[ヘッダー]のボタンをライブビューにドラッグします。

pic-20160524_01

こうするだけで、ライブビューへ直接、headerタグの挿入ができます。

 

挿入後、下記の図のようにid名もしくはclass名をつけるためのボタンが出てきます。

pic-20160524_02

「+」のボタンを押し、「#test」と入力します。

pic-20160524_03

すると、図のようにheaderにid名がtestとついた状態でコードを記述してくれます。(Class名であれば「.」をクラス名の前につけます。)

pic-20160524_04

 

このように、DreamweaverCC2014では、ライブビューによる正確なコーディングが行えますので、是非試してみてくださいね。

 

WEB初心者から最短3ヵ月でWEBデザイナーを目指す

コロナ禍でリモートワークが増え、在宅でできるWEBデザイナーの仕事に人気が集まっています。

そこでKENスクールではニーズの高いオンライン完結のWEBデザインスクールを開校しました。WEBデザイナーになるために必要なカリキュラムを揃え、資格系を除いたすべてのカリキュラムを、通学と同じクオリティで提供致します。

完全マンツーマン授業で毎回先生が変わらないので、生徒の悩み、得手不得手などにいち早く気づき、生徒一人ひとりに合わせた指導をする事が可能です。

最短3ヵ月でWEBデザイナーを目指せる実践レベルで学ぶためのカリキュラムで、就転職のサポートまで付いたコースをご用意しています。

無料カウンセリングも実施していますので、ご興味のある方はこちらよりお問い合わせください。

この記事に関連する講座

Webサイト作成の定番ソフトDreamweaverを使いこなす!

詳しくはこちら