タグの直接入力によるウェブページの制作 練習課題1~3

Slides:



Advertisements
Similar presentations
情報処理 A 第 5 回かな? ワードの使い方. 拡張子  ファイルの名前は, “ ファイル名. 拡張子 ” で付け る.  拡張子は,そのファイルを読み込むソフトに影 響される –txt テキストファイル –doc ワードのファイル –xls エクセルのファイル –pdf Acrobat Reader.
Advertisements

BWD06-01 ~ 1 ~ Web デザイン基礎 坪倉、伊藤 日本文理大学 先週 – ガイダンス – Webの歴史 –HTML 基礎 今週 について(出席と課題提出) –HTML 画像、ハイパーリンク、文字書式.
コンピュータ基礎実習 ( 上級 ) 第九回 スタイルシート 清水淳紀. はじめに  今回の内容  スタイルシート (CSS) とは何か  CSS の役割  CSS の利点  スタイルシートの基本  CSS の記入方法  基本的な CSS の例.
2017/2/26 情報処理 第5回.
企画書作成ソフトウェアの開発 佐々木研究室 05k1134 吉村祥平.
情報処理実習 第05回 Excelマクロ機能入門 操作マクロ入門.
デジタルコンテンツを 活用した授業作り ~プレゼン型のワンポイント教材作成 札幌新川高校 早苗雅史 3/Aug/2005.
2017/3/2 情報処理 第8回.
PowerPointのチュートリアル Version 2.4( )
パソコン教室(Word) ワークフロア清柳
HTMLの基礎知識.
【2.12】文字装飾機能内部設計書
2017/3/7 情報処理 第8回.
プレゼンテーション用ソフトウェア Impress
CEC公開授業 Webサイト制作にチャレンジ! 2007年11月20日 於:東京都立板橋有徳高校 学校インターネット教育推進協会.
ウェブページ制作の基礎 タグの直接入力によるウェブページの制作 次のスライドへ進んだり,戻ったりしたい時は,右下のボタンをクリック。 次へ.
PowerPoint の基本操作 情報機器の操作(e) 2016.
HTMLの記述と WWWにおける情報公開 遠藤
法人e名刺 ブログ運用マニュアル 社外秘 目次 □ブログ運用ルール
HTML版パスファインダーの作成 CSSの利用 hp. infoseek. co. jp/cje10
ホームページの作り方.
色覚の多様性に配慮した案内サイン図表等用のカラーユニバーサルデザイン推奨配色セット
プレゼンテーション用ソフトウェア Impress
PowerPointのチュートリアル 第一版( )
オペレーティングシステムⅡ 第3回 講師 松本 章代 VirtuaWin・・・仮想デスクトップソフト 2009/10/16.
発表課題 インターネット上においての色の表現 調査期間:2012年05月~06月 発表日:2012年06月07日
専門ゼミⅠ 南ゼミ 特別授業③ 2002年6月7日 金曜日 4限目 今泉 裕隆.
情報処理 第10回.
情報処理 第10回.
コンピュータ基礎実習上級 #10 絶対パスによる指定
2017/4/9 情報処理 第5回.
13 Microsoft Word(4) 13.1数式の入力 Microsoft 数式の起動
県立広島大学 全学共通教育科目 情報処理入門 第13回 2009年7月6日 県立広島大学 経営情報学部経営情報学科 准教授 小川 仁士.
サイト運営者へむけて、CMS管理画面をつかって サイト運営していく方法を紹介します。
スタイルシート C306 情報発信の基礎【第6回】.
WordPressに挑戦! WordPress(ワードプレス)は、ブログを 作成するためのWEBアプリケーションです。
ネットワーク de 情報発信 - コンテンツ作りのはじめの一歩 - 城西国際大学薬学部 二村 典行.
コンピュータ プレゼンテーション.
経営工学基礎演習a Word第1回目.
※現在辻はAmazonの「この本を買った人はこの本も買っています」
第3章 第2節 ネットワークを活用した 情報の収集・発信(3) 5 表現方法の工夫
簡単PowerPoint (PowerPoint2007用)
Microsoft PowerPoint Netscape Communicator
情報処理基礎 2006年 6月 22日.
ホームページ作成・更新講座 夏のコンピュータ学習会 画像
HTTPとHTML 技術領域専攻 3回 中川 晃.
色覚の多様性に配慮した案内サイン図表等用のカラーユニバーサルデザイン推奨配色セット
情報スキル活用  第5週 基礎技術-5  その2 : 他のページへのリンク.
PowerPoint の基本操作 情報機器の操作(e).
第3章 第2節 ネットワークを活用した 情報の収集・発信(2) 4 文書の構造と表現
情報処理 第4回.
明日の授業でも作成を継続する予定です 2017/11/13、2017/11/14
タグを使ったウェブページ作成 兵庫県立伊丹北高等学校 佐藤 勝彦.
Microsoft PowerPoint98 Netscape Communicator 4.06[ja]
3.1 PowerPoint の概要 PowerPointを使ってできること
コンピュータ プレゼンテーション.
情報スキル活用 第2週 基礎技術ー2 : Webページの基本形.
テキスト 1 行目 テキスト 2 行目 テキスト 3 行目 (初級) 森の背景の上にフェード インするアニメーション化されたキャプション
Htmlの基本.
コンピュータ プレゼンテーション.
ウェッブページ書法の復習 ネットワーク論以前のお話.
コンピュータと情報 第4回 ワードの使い方.
管理画面操作マニュアル <メールマガジン配信> 第5版 改訂 株式会社アクア 1.
コンピュータ プレゼンテーション.
簡単PowerPoint (PowerPoint2003用)
情報処理 II 第12回の教材 プレゼンテーションソフト PowerPoint 高知大学理学部 数理情報科学科1回生い組対象 担当:塩田教官
スライドの終わりまでテキストが繰り返しスクロールされます • スライドの終わりまでテキストが繰り返しスクロールされます •
例題のプログラムを通して JavaScriptの仕組みを理解することとします。
サンプル見出し テキスト 1 行目 テキスト 2 行目 テキスト 3 行目 (中級) 図の背後でタイトルを移動させるアニメーション効果
PowerPoint の基本操作 情報機器の操作 (e).
Presentation transcript:

タグの直接入力によるウェブページの制作 練習課題1~3 ウェブページ制作の基礎 タグの直接入力によるウェブページの制作 練習課題1~3 次のスライドへ進んだり,戻ったりしたい時は,右下のボタンをクリック。 次へ

練習課題で使用するタグ一覧 タグ 意味 <b> </b> 太字 <i> </i> 斜体 <h1> </h1>~<h6> </h6> 見出し文字 タグ 意味 <sup> </sup> 上付き文字 <sub> </sub> 下付き文字 前へ 次へ

練習課題に取り組む前に テキストエディタなどを使って以下の記述をする。 ファイル名は,「ren.html」とする。 表示例 HTML記述例 前へ 次へ

練習課題1(背景色の変更) フラワーショップのウェブページを以下のようにする。 ●背景色を黄緑色にする。(他の色で試してもよい) 表示例  ●背景色を黄緑色にする。(他の色で試してもよい) 表示例 参考 色 カラーコード(16進数) 黒 000000 白 FFFFFF 赤 FF0000 青 0000FF 緑 008000 黄 FFFF00 黄緑 00FF00 前へ 次へ

練習課題1 <body bgcolor=“#00FF00”>で背景色を指定する。 完成後,ファイル名「ren1.html」で保存する。 表示例 HTML記述例 前へ 次へ

練習課題2(文字の装飾1) 練習課題1で作ったページ「ren1.html」を以下のようにする。 ●「お花」の文字を強調する。 表示例 参考  ●「お花」の文字を強調する。 表示例 参考 効果 タグの書き方 太字 <b> </b> 斜体 <i> </i> 見出し文字 <h1> </h1>~ <h6> </h6> 前へ 次へ

練習課題2 <b><h2>お花</h2></b>で文字の装飾を指定する。 完成後,ファイル名「ren2.html」で保存する。 表示例 HTML記述例 前へ 次へ

練習課題3(文字の装飾2) 練習課題1で作ったページ「ren1.html」を以下のようにする。 ●「お花」の文字を上付き文字にする。 表示例  ●「お花」の文字を上付き文字にする。 表示例 参考 効果 タグの書き方 上付き文字 <sup> </sup> 下付き文字 <sub> </sub> 前へ 次へ

練習課題3 <sup>お花</sup>で上付き文字を指定する。 完成後,ファイル名「ren3.html」で保存する。 表示例 HTML記述例 前へ 次へ

まとめ:今回使用したタグ一覧 タグ 意味 <b> </b> 太字 <i> </i> 斜体 <h1> </h1>~<h6> </h6> 見出し文字 タグ 意味 <sup> </sup> 上付き文字 <sub> </sub> 下付き文字 前へ 次へ