Dreamweaver CC入門

別のCSSファイルに切り替えよう

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
CSSデザイナーパネルを使って、CSSファイルの関連付けの解除方法と、別のCSSファイルに関連付けし直す方法について学びます。
講師:
03:26

字幕

このレッスンでは別の CSS ファイルに切り替える方法について解説します。現在は cafe.css が関連付けられているindex.html が表示されています。関連ファイルツールバーでどの CSS ファイルが関連づいているかを確認することができます。今回は cafe.css の関連付けを外して既に用意されている scopp.css を新たに関連付けします。まずは index.html の関連ファイルツールバーの中から「ソースコード」をクリックしてindex.html のソースコードを表示させておきます。続いて、パネルグループのCSS デザイナーパネルをクリックしてCSS デザイナーパネルをアクティブにしておきます。CSS デザイナーパネルの「ソース」ペインの中のcafe.css をクリックして選択します。続いて、ソースペインの左上にある-ボタンをクリックします。そうすると cafe.css の関連付けが解除されました。現在 index.html は何も関連付けられていない状態なので関連ファイルツールバーもなくなりました。続いて、scopp.css に関連付けし直します。CSS デザイナーパネルの中の+ボタンをクリックしプルダウンメニューから「既存の CSS ファイルを添付」をクリックします。 「既存の CSS ファイルを添付」ダイアログボックスが出てきました。ダイアログボックスの中の「参照」ボタンをクリックします。ここからサイト設定がしてあるサイトフォルダーの中からscopp.css を選択し「開く」ボタンをクリックします。これで scopp.css を選択することができました。ダイアログボックスのOK ボタンをクリックします。改めて CSS ファイルが関連付けされたのでDreamweaver の「名前」タブの下には関連ファイルツールバーが再表示されています。関連ファイルツールバーの中にはscopp.css が表示されています。クリックをすると scopp.css のコードを確認することができます。関連ファイルツールバーの「ソースコード」をクリックしてindex.html が選ばれている状態にしておきます。この状態で上書き保存をします。最後にブラウザーでの表示確認もしておきましょう。Dreamweaver の右下にある地球マークから確認したいブラウザーをクリック。そうすると、scopp.css の内容が反映されていることが確認できます。確認がとれましたら、ブラウザーのバツ印をクリックしてブラウザーを閉じておきます。 このレッスンでは別の CSS ファイルに切り替える方法について解説しました。

Dreamweaver CC入門

DreamweaverはWebサイトに関係するHTMLファイルやCSSファイルなどを効率よく作成できるアプリケーションです。このコースではDreamweaverを使ってみたい、使ってみたけれどよくわからないという方に向け、サイト設定やHTMLのマークアップなどの基本操作を紹介します。またWebサイトを制作するために必要な知識も一緒に解説します。

1時間41分 (42 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 2,990
発売日:2016年08月01日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。