Muse基本講座

タブの作成

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

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
タブで内容を切り替えられるタブパネルの設置と、内容やカラーの変更について解説します。
講師:
04:00

字幕

このレッスンでは 「タブパネル」について解説します それではサンプルファイルの 「 ABOUT ME 」の中に入って その中のこの空いている所に 「ウィジェットライブラリ」から 「タブ付きパネル」を持ってきます そうすると こんなパネルがやってくるので これをどんな感じに見えるか プレビューで見てみましょう 「タブ」はこの様に クリックした所に 内容が切り替わるという 同じ面積で いっぱいのテキストを置ける 便利なものです これの中身を設定してみましょう 今回はこの「 skills.txt 」 この内容をこちらに反映させようと思います ではまず 見出しが「 Photoshop 」 「 Illustrator 」「 HTML & CSS 」 と 3つあるので これをそれぞれ 「 Photoshop 」をコピーして 「テキストツール」をクリックして 文字を選んで貼り付けます そうしたら「 Illustrator 」も Ctrl または command + C を押して こちらに並んだら Ctrl または command + V を押して 貼り付けます 「 HTML & CSS 」も同じ様に 貼り付けます そうしたら タブの中身の方を変えていきましょう タブもこの様にクリックすると 中が変わるので まず写真も張り付けてあります 2回クリックするとこれを選べます 今回は写真を使わないので Delete してしまいます こっちに切り替えて これも写真は使わないので Delete します こっちも写真は要らないので Delete します そうしたらテキストエリアが ちょっと狭いので 横に広げましょう こちらも ちょっと狭いので広げます こっちも広げます そうしたら 「 Photoshop 」の 本文の方を 貼り付けます そうしたら 次のタブの方にも 「 Illustrator 」の本文を 貼り付けます そして「 HTML & CSS 」です こちらも 貼り付けます そうしたら これで文章ができたので 後はタブの色を変えたいと思います これを2回クリックすると 「ラベル」というのが選べるので これで「ステート」を開けます 見やすいように切り離します そうしたら まず「通常」ですけど この文字と同じ オレンジ色を選んでみましょう 「ロールオーバー」「マウスダウン」 この重なっている時です これをちょっと目立つように 黄色にしましょう 「ロールオーバー」を選ぶと 「マウスダウン」も一緒に選ばれます そして「アクティブ」 今いるタブはこちらの本文から地続きで 白にしておきましょう こんな感じで内容ができました では これをページプレビューで 今度は見てみましょう そうすると こんな感じのタブが出来て クリックしたところに切り替わって 本文から ひと続きになりました 「タブ」は決まった面積で いくつもの項目を出したい時に 非常に効率よく便利なので 是非とも活用して下さい

Muse基本講座

Adobe MuseはHTMLやCSSといった専門知識がなくても、IllustratorやInDesignを使うような感覚で手軽にWebサイトをデザインできるソフトです。このコースではMuseを使ってページに文章や写真をレイアウトするやり方やグラフィックの作成、モバイル機器に対応したサイトの作成方法などについて学習します。

3時間55分 (72 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 3,990
発売日:2015年05月20日

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

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

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