[ 学習動画 ] 一覧 学習の閲覧や質問の際にご利用ください 閲覧が終了した動画をチェックして 学習の進行状況を確認しましょう! 閲覧チェック Dreamweaver/HTML5/CSS3 講座 HTML/CSS リファレンス 動画タイトル 時間 ( 計 10 時 57 分 ) Chapter01

Similar documents
ホームページ制作 基礎編 (HTML5 CSS3 コーディング )

[ 学習動画 ] 一覧 学習の閲覧や質問の際にご利用ください 閲覧が終了した動画をチェックして 学習の進行状況を確認しましょう! グラフィックワーク 閲覧チェック 動画タイトル 時間 ( 計 22 時 33 分 ) 名刺 約 56 分 デザインコンセプト説明 約 04 分 01 新規フ

[ 学習動画 ] 一覧 学習の閲覧や質問の際にご利用ください 閲覧が終了した動画をチェックして 学習の進行状況を確認しましょう! グラフィックリファレンス 閲覧チェック 動画タイトル 時間 ( 計 20 時 10 分 ) Step1 Illustratorの基本操作 Illustratorの起動と基

Web 設計入門

IBM Business Process Manager CSS による Coach レイアウト制御ガイド WebSphere 2014 IBM Corporation

Microsoft PowerPoint - CSS(Cascading Style Sheets)の基本.pptx

Microsoft PowerPoint - css-3days 互換モード

クイックスタートマニュアル目次 スマホサイトビルダーモビークとは? モビークの特徴 ドラッグ& ドロップで簡単編集 スタイリッシュなデザイン部品 PC サイトと自動連動 最高のSEO 対策導入までの流れ STEP1 初期デザイン設定 STEP2 ページの登録 STEP3 スマホページの編集 STEP

Microsoft PowerPoint - css-3days 互換モード

extChatText.pdf

第6回 CSS入門(つづき)

Microsoft PowerPoint - css-3days.ppt [互換モード]

vi 目次 画像のサイズ設定 画像の効果 画面の取り込みとトリミング Office の共通基本操作 図形 図形の挿入と削除 図形の編集 図形の背景色の透過 Office

Web 設計入門

スタイルシートでデザインを整えよう

<4D F736F F D E835A A C98AD682B782E98E77906A89FC92F994C52E646F63>

経営論集2011_07_小松先生.indd

extCountdown.pdf

<4D F736F F D A957A A A8FEE95F18F88979D DEC90AC E646F63>

子ボックスや孫ボックスなどに position: absolute; と指定すると それぞれ親ボックスに対する絶対位置で配置できるので親ボックスの上に複数の子ボックスや孫ボックスを重ねて配置することができます トランジションやアニメーションを作成するときに非常に便利なので覚えておきましょう top

保存版 改訂版 日本私立短期大学協会広報 HP 短大クエスチョン 情報発信マニュアル 2019 年 1 月 日本私立短期大学協会 株式会社ル プロジェ制作

[ ]スマートセミナーバージョンアップリリースノート

07_経営論集2010 小松先生.indd

地域ポータルサイト「こむねっと ひろしま」

FutureWeb3 Web Presence Builderマニュアル

第21章 表計算


コンピュータ基礎実習 ( 上級 ) 第 12 週例では <h1> タグが対象であることを意味します セレクタを変えることで見栄えを様々な対象に設定できます プロパティ (property) は設定する見栄え ( スタイル ) の種類のことです 値はプロパティに対する具体的な設定値です この例では文字

Web情報システム 第1章~第5章

brieart変換設定画面マニュアル

■新聞記事

タグ付きPDFとは何か?

Kazasu アンケート機能 操作マニュアル 1

EC 千葉のホームページで使用している CSS CSSスタイルシート ( 外部記載 ) /* == 標示枠背景に壁紙設置 ( 全画面共通 )======= */ body { background-ima

about かみのごうや たいち 大阪府出身 東京都在中 28歳 うお座 O型 ゾウと写真が好き 2xup.org を管理

Web10.pptx

Web 設計入門


目次 概要... 2 フォームレイアウトデザイナー機能の設定... 3 設定したフォームレイアウトデザイナーの確認...14 その他スタイルの設定...15 フォームレイアウトデザイナーをエクスポート...17 フォームレイアウトデザイナーをインポート...18 インポート時の制限事項...19 リ

【インターネットビルダー2】投稿マニュアル

競技課題|ホームページ

JavaScript カスタマイズ入門 kintone university アプリデザイナープラス JavaScript カスタマイズ入門編演習問題回答 演習問題 第 2 章サンプルで試そう 1 cybozu.com developer network の サンプルで試そう ( 以下 サンプル と

ホームページ 成功事例説明会

合宿事前講座 Web 開発の基本編その 2 情報研究会モブ 薗田海樹 The. H.30 情報研究会 1

padding( パディング ) padding プロパティでボックスの内側の余白を指定します この部分の内側には背景 ( 背景色や背景画像 ) を表示できます border( ボーダー ) border プロパティでボックスの境界線を指定します ボーダーには色 太さ 線の種類を指定できます 画像で

2. 以下の設問に答えよ 第 11 問 アンシャープマスクの説明として最も適切なものを 以下より 1 つ選択しなさい 1. ピクセル間の色の差を強調するフィルタ 2. 画像全体をぼかすフィルタ 3. 隣接するピクセルの色を同じにするフィルタ 4. 画像全体を暗くするフィルタ 第 12 問 ウェブペー

定期講座ガイド ~Office2016~ 協立情報通信株式会社

Microsoft Word - 教材WebページのHTML5及びCSS3の解説

数のディジタル化

1. 管理画面へのログイン方法 (1 ) エコボル サイトの TOP ページから登録店専用ページへユーザー名 パスワードを入力してログインボタンをクリックします 図 1) エコボル サイトの TOP 画面 図 2) システムログイン画 登録店さまには事前にユーザー名パスワードを記載したメールを送付し

フォト アルバム

brieart初期導入ガイド

2 / 16 HTML=HyperText Markup Language( ハイパーテキストマークアップランゲージ ) ブラウザ (Chrome) での表示 ソースの表示 ( メモ帳 /TeraPad) HTML <========= =========>


HTML5&CSS3 レッスンブック

■デザイン

TweecPress-Manual.indd

2 / 25 複数ソフトの組み合わせ テキストファイルを Excel で開く テキスト形式 (.txt) で保存したファイルを Excel で利用しましょう 第 14 講で保存した west.txt を Excel で開きます 1. Excel を起動します 2. [Office ボタ

スライド 1

ISコースプロジェクト実習 前期(第1回 ガイダンス)

1. ログイン 1-1 管理画面へのログイン 施設の作成 編集 削除や承認 公開には その操作権限を持つアカウントでログイン します アカウントについての詳細は 管理者にお問い合わせください (1) [ ユーザー ID またはメールアドレス ] と [ パスワード ] を入力後 [ ログイン ] を

スーパー英語アカデミック版Ver.2

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション

(3) 本文を書く 実際にページを開いたときに表示される本文を書いてみましょう から の間に書きます <html > <head > <title > 武のホームページ </title > </head > </html > (4) ページを保存する ここで一度ページを保存してみましょう テキストエ

スライド 0

コンテンツ作成基本編

01ログイン

Web05

1. ログイン 1-1 管理画面へのログイン 施設の作成 編集 削除や承認 公開には その操作権限を持つアカウントでログイン します アカウントについての詳細は 管理者にお問い合わせください (1) [ ユーザー ID またはメールアドレス ] と [ パスワード ] を入力後 [ ログイン ] を

エクセル応用 2016 第 1 章関数の利用 1 作成するブックを確認する 2 関数の概要 3 数値の四捨五入 切り捨て 切り上げを使う 4 順位を求める 5 条件で判断する 6 日付を計算する 7 表から該当データを参照する 第 2 章表作成の活用 1 作成するブックを確認する 2 条件付き書式を

Microsoft Word - 資料5-1_資料掲載_ver docx

Microsoft Word - ニュース更新システム(サイト用).docx

page1.doc

PowerPoint プレゼンテーション

ボタンのトランジション 1 トランジションを利用して ボタンを作ってみましょう ボタンを工夫することでひときわ光る web ページにすることができます もう Illustrator や Photoshop でボタンの画像を作る必要はありません JavaScript でスクリプトを書く必

スライド 1

スライド 1

ブロックの 1 文字目のを変更する セレクタ : first-letter { 1 文字目のを指定するフォントや文字色 背景色 枠線などの ブロックの 1 文字目を字下げする text-indent: 字下げ幅段落の1 文字目の字下げ幅を指定する em( 標準 1em) px( ピクセル ) pt(

1-2. 文字の編集について (1) 文字入力する ページ編集フィールド 上では キーボードからの文字入力 または コピーした文章の貼り付け操作に より 文章を入力します 以降 文字入力に関する操作について説明します ページ編集フィールド (1) 改行の扱いについて [Enter キー ] を押下し

PowerPoint プレゼンテーション

目次 第 1 章 インストール編 1. ATHENAをインストールする 2. ATHENAを起動する 第 2 章 HTML作成編 1. HTMLを新規作成する 2.各ボックス機能の使い方 3.パーツ 4.ボタン画像 CSSボタン 見出し テーブル 5.ファイル出力とアップロード 6.ライブラリ 7.

Microsoft Word - 操作マニュアル(PowerPoint2013)

注意事項 (1)Windows 10 を使用する場合 注意事項 1 注意事項 3 注意事項 4 についてご対応をお願いします (2)Windows 8.1 を使用する場合 注意事項 2 注意事項 3 注意事項 4 についてご対応をお願いします (3)Windows 7 上で Internet Exp

インターネット社会の発展

World Wide Web =WWW Web ipad Web Web HTML hyper text markup language CSS cascading style sheet Web Web HTML CSS HTML

Microsoft PowerPoint _3a-SEO.pptx

overflow プロパティの指定は 親ボックスのスタイルに記述します overflow プロパティは position プロパティ (position: static; 以外 ) の指定がされていなと適用されません ボックスの外にはみ出た部分を表示させたくないときに hidden を使用します サ

目次 1. アニメーションの仕組み 3 2. ワードアートでムービーのタイトルを作成 7 3. まとめ 課題にチャレンジ 19 [ アニメーション ] 機能 PowerPoint に搭載されている [ アニメーション ] 機能を使用すると 文字や図形にアニメーション ( さまざまな動きや

文書作成ソフト ( 初級 ) 第 1 章 Wordの基礎知識 STEP1 Wordの概要 STEP2 Wordを起動する STEP3 Wordの画面構成 STEP4 ファイルを操作する STEP5 Wordを終了する第 2 章文字の入力 STEP1 IME2010を設定する STEP2 文字を入力す

【お試し版】Web制作者のためのCSS設計の教科書(非売品)

目次 STEP.1Word ファイルを小冊子にする... 1 注意... 2 STEP1-1 印刷 (EPSON) の場合... 5 STEP.2 冊子つくり... 7 STEP.3 新しいページの挿入... 7 STEP.4 見出し... 8 STEP.5 目次を作成... 9 STEP.6 冊子

HTML5 CSS

transform: skewx(x 軸の傾斜角度 ) transform: skewy(y 軸の傾斜角度 ) transform: skew(x 軸の傾斜角度, Y 軸の傾斜角度 ) skewx( ) は X 軸に沿って傾斜します skewy( ) は Y 軸に沿って傾斜します skew( ) は

サンプル CSS1 入力フィールドの輪郭 (outline) のトランジション 入力フィールドをクリックすると変化します InputOutlineTransition の説明 HTML の記述 (InputOutlineTransition.html) id 属性 field の div 要素を作り

Microsoft Word - P doc

目次 STEP.1 冊子の作成 Word を起動し ページの設定... 1 STEP.2 冊子の表紙作成 Word2007ワードアートの挿入 ( 表紙作成 ) Word2010ワードアートの挿入 ( 表紙作成 )... 3 STEP.3 新しいページの挿入.

Web データ管理 HTML+CSS (7) (2 章 ) 2011/11/16( 水 ) 湘南工科大学講義資料 Web データ管理 (2011) 阿倍 1/15

id, クラスで指定 (#id 名,.class 名 ) 4. 様々なセレクタ a,b :a と b を指定 a b :a の下の階層の b を指定 a>b :a の直下の b を指定 a+b :a の次の b を指定 ab :a かつ b を指定 5. 属性セレクタ a[b] :a タグ内で b

スライド 1

Transcription:

[ 学習動画 ] 一覧 学習の閲覧や質問の際にご利用ください 閲覧が終了した動画をチェックして 学習の進行状況を確認しましょう! 閲覧チェック Dreamweaver/HTML5/CSS3 講座 HTML/CSS リファレンス 動画タイトル 時間 ( 計 10 時 57 分 ) Chapter01 オリエンテーション 約 40 分 01_ 学習の進め方 02_ リファレンスの紹介 約 09 分 03_ サンプルファイルの確認 04_Dreamweaverでの学習の準備 (1) 約 12 分 05Dreamweaverでの学習の準備 (2) 約 09 分 06GoogleCromeでの学習準備 Chapter02 Webの基本 01_webページを表示するしくみ 02_webページをつくるファイル 約 14 分 Chapter03 HTMLの基本 約 32 分 01_HTMLとは 02_HTMLの基本構文 03_HTMLに必須の要素 約 09 分 04_ ブロックレベル要素とインライン要素 約 08 分 05_ 属性を詳しくみる 約 06 分 Chapter04 HTMLを記述する際の注意 約 16 分 01_HTMLを記述する際の注意 約 08 分 02_ 実体参照 03_HTMLのコメント Chapter05 リンク構造を作る 約 13 分 01_aアンカー 02_ 相対パスと絶対パス 約 06 分 Chapter06 全ての要素を確認する 01_ すべての要素を確認する Chapter07 テキストコンテンツに関する要素 01_p_ 段落 02_ul_ 順序なしリスト 03_ol_ 順序つきリスト 04_dl_ 説明リスト 05_div_ コンテンツ分割 06_hr_ 主題分割 07_blockquote_ ブロック引用 08_figure_ 図表 自己完結コンテンツ 09_pre_ 整形済みテキスト Chapter08 コンテンツセクショニングに関する要素 01_h1_h6_ 見出し 02_header_main_footer 03_article_ 記事など 自己完結コンテンツ 04_section_ セクション 05_nav_ 目次 06_address_ 連絡先 07_aside_ 間接的な関係の文章 約 29 分約 04 分約 24 分約 04 分約 04 分約 04 分

Chapter09 画像とマルチメディアに関する要素 01_img_ 画像 02_audio_ 音声 03_video_ ビデオ 04_map_ クリック可能な領域指定 Chapter10 テーブルに関する要素 01_table_ テーブル 02_table_ 行 列の結合 03_table_ その他の要素 約 19 分約 08 分約 14 分約 04 分 Chapter11 フォームに関する要素 約 55 分 01_formフォーム 02_1 行のテキスト 約 10 分 03_1 行のテキスト _emailアドレス 約 04 分 04_1 行のテキスト _ パスワード 05_ 複数行のテキスト 約 06 分 06_ セレクトボックス 07_ ラジオボタン 約 09 分 08_ チェックボタン 約 10 分 Chapter12 その他 覚えておきたい要素 01_br_ 改行 02_span_ 行内汎用コンテナ 03_small_ 注釈 04_strong_em_ 重要性 強調 05_del_ins_ 編集範囲の特定 06_iframe_ インラインフレーム 約 16 分約 04 分 Chapter13 その他 覚えておきたい要素 約 43 分 01_ 設定されているメタデータの概要 約 04 分 02_viewport_ スマートフォン対応 約 06 分 03_IE 互換モード 04_ タッチアイコン 05_ ファビコン 06_ 自動リンクの設定 Chapter14 SEO 対策 SNS 対策 01_SEO 対策とは 02_SEO 対策の設定 03_SNS 対応 OGPとは 04_OGPの設定 05_Twitter 専用の設定 Chapter15 地図 動画の読み込み 01_youtubeの読み込み 02_GoogleMapの読み込み 約 21 分約 06 分約 09 分約 04 分 Chapter16 コンテンツモデルについて 約 06 分 01_ コンテンツモデルについて 約 06 分 Chapter17 CSSの基本 01_CSSとは 02_CSSの基本構文 03_CSSを記述するところ 04_CSSの学習を始める前の準備 約 27 分約 06 分約 11 分

Chapter18 セレクターの種類 約 16 分 01_ セレクターの種類 02_ 要素セレクター 03_classセレクター 04_idセレクター 約 04 分 05_ 属性セレクター 06_ 全称セレクター Chapter19 擬似クラス 約 26 分 01_ 擬似クラスとは 02_hover 03_checked 04_active 05_focus 06_firstChild_lastChild 07_firstOfType_lastOfType Chapter20 疑似要素 約 11 分 01_ 擬似要素 02_before_after 03_fisrtLetter_firstLine 約 04 分 Chapter21 セレクターの組み合わせ 約 17 分 01_ セレクターの組み合わせ 02_ 複数のセレクタを同時に指定 03_ 子孫結合子 AB 約 04 分 04_ 子結合子 A-B 05_ 隣接兄弟結合子 A+B Chapter22 CSSを記述する際の注意 約 19 分 01_CSSを記述する再の注意 02_ コメント 03_ カスケード 04_ スタイルの継承 約 06 分 05_ スタイルの優先順位 Chapter23 文字 行に関するプロパティ 約 31 分 01_ フォント全般の指定 02_ フォントスタイル 03_ フォントの太さ 04_ フォントサイズ 05_ 行高の指定 06_ フォントファミリー 約 04 分 07_ 文字色の指定 08_ 文字横揃えの指定 09_ 縦揃えの指定 10_ 文字装飾の指定 Chapter24 トピックス 01_CSSでの色の指定 02_CSSでの長さの指定 (1) 02_CSSでの長さの指定 (2) 約 29 分約 14 分約 04 分約 11 分

Chapter25 背景に関するプロパティ 約 16 分 01_ 背景全般の指定 02_ 背景色 03_ 背景画像 04_ 背景画像のサイズ 05_ 背景画像の繰り返し 06_ 背景画像の位置 Chapter26 ボックスに関するプロパティ 約 51 分 01_ ボックスとは 約 04 分 02_ ボックスモデルとは 03_border 枠線 約 04 分 04_borderradius 枠角 05_ 影をつける 06_padding_ 内余白 07_margin_ 外余白 08_ マージンの相殺 09_ 高さの指定 10_ 幅の指定 約 04 分 11_ 高さ 幅の計り方 約 06 分 12_ アウトライン Chapter27 表示 配置に関するプロパティ 約 28 分 01_ 表示に関する指定 約 06 分 02_ はみ出しに関する指定 約 04 分 03_ 配置に関する指定 約 09 分 04_ 配置位置に関する指定 05_ 表示順に関する指定 約 06 分 Chapter28 アニメーションに関するプロパティ 約 15 分 01_ 時間変化 02_ アニメーション 03_ 変形 Chapter29 レイアウト 約 08 分 01_ フレックスボックス _flex 約 08 分 02_floatとclear 約 06 分 03_clearfix Chapter30 @ 規則について 約 10 分 01_@ 規制について 02_ 画面の種類に応じたスタイル変更 Chapter31 JavaScript 01_JavaScript

閲覧チェック HTML/CSS ワーク 動画タイトル 時間 ( 計 11 時 32 分 ) 01-01. アプリサイト - HTML 約 156 分 01 完成形の確認と制作の流れについて 02 コードエディタと制作環境について 約 08 分 03 HTMLと使用するwebブラウザについて 約 09 分 04 HTMLを作成してみる 約 11 分 05 HTML5つの基本 約 08 分 06 HTMLの組み方の手順 (1) 約 06 分 06 HTMLの組み方の手順 (2) 約 09 分 07 ヘッダー / フッダー / メインタグ 約 10 分 08 見出しのタグ 約 12 分 09 ブラウザの確認とHTML5 outliner 10 What's tempwave? のマークアップ (1) 約 12 分 10 What's tempwave? のマークアップ (2) 約 14 分 11 ヘッダー 約 11 分 12 アプリの機能紹介部分 (1) 約 06 分 12 アプリの機能紹介部分 (2) 約 10 分 13 フッター 約 04 分 14 headタグの中身について 約 10 分 15 W3C Validation Service 約 06 分 01-02. アプリサイト - CSS - PC 約 337 分 01 CSSとは? 約 08 分 02 reset.css 03 CSSの記述ルールについて 約 12 分 04 CSSコーディングの流れについて 約 08 分 05 文字のサイズと色の設定 約 06 分 06 font familyとweb fontについて 約 13 分 07 フルードイメージについて 08 ヘッダーエリア (1) ボックスの説明 08 ヘッダーエリア (2)Margin-auto 約 08 分 08 ヘッダーエリア (3)line-height 約 08 分 08 ヘッダーエリア (4)marginとPaddingの違い 約 11 分 09 横並びレイアウト float(1) 約 06 分 09 横並びレイアウト float(2) 約 15 分 10 floatの続き (1) 約 10 分 10 floatの続き (2) 11 背景画像の調整 約 12 分 12 フッターエリア (1) 複数の背景画像の設定 約 14 分 12 フッターエリア (2) 中央揃え 約 12 分 12 フッターエリア (3) spanタグ 約 12 分 12 フッターエリア (4) 仕上げ 13 font-awesome 約 13 分 14 背景関連 約 09 分 15 flexboxの基礎 (1) 約 08 分 15 flexboxの基礎 (2) 約 09 分 16 flexboxを使った様々なレイアウト 17 特徴エリア 約 11 分 18 flex-direction 約 12 分 19 様々なセレクター 約 10 分 20 アイコン部分の設定 約 14 分 21 特徴部分の仕上げ 約 16 分 22 What's tempwave(1) 22 What's tempwave(2) 約 11 分 22 What's tempwave(3) 約 12 分 22 What's tempwave(4) 約 14 分

01-03. アプリサイト - CSS - SP 約 120 分 01 スマホサイトのコーディングのポイント 約 13 分 02 ヘッダーのスマホ用レイアウトの調整 約 08 分 03 スマホ用レイアウト (1)What's tempwave 約 06 分 03 スマホ用レイアウト (2)weather now 約 06 分 04 box-sizing-border-boxについて 約 09 分 05 ヘッダー細部の調整 約 12 分 06 What's tempwave 細部の調整 07 オーバーレイ細部の調整 08 weather now(1) 約 06 分 08 weather now(2) 08 weather now(3) 約 08 分 09 フッター細部の調整 約 14 分 10 文字周りの調整 約 09 分 11 タブレットで見たときの見た目の調整 約 08 分 01-04. 番外編 Google Chromeの検証ツールの使い方 CSSが効かない時に確認したいこと (1) CSSが効かない時に確認したいこと (2) 約 41 分 約 18 分約 12 分約 11 分 01-05. サーバーへのアップロード FTPについて (1) FTPについて (2) サイトの公開方法 (1) サイトの公開方法 (2) 約 38 分 約 10 分約 10 分約 06 分約 12 分 閲覧チェック Web 概論 動画タイトル 時間 ( 計 0 時 51 分 ) Web 概論 01.Web ってなに? 02.Webサイトを作るのに必要なもの 03.Web 制作の流れ 約 51 分 約 21 分約 12 分約 18 分