本章重點 4-1 使用者導向設計 4-2 網頁組織結構 4-4 進階清單的變化功能 4-5 使用超連結(hyperlink)功能.

Slides:



Advertisements
Similar presentations
醫學美學之我見ー肉毒桿菌 班級:應日三乙 姓名:蔡雅卉 學號: 497E0076. 前言 現在的人,已經把 整型看做是微不足 道的事情了。即使 只是戴牙套、局部 雷射、割雙眼皮、 打美白針、肉毒桿 菌等等,都可以在 身體上做不同的改 變,而讓自己更滿 意自己的外表。
Advertisements

讲故事训练 授课人:田轶.
第十一課 菜園 6-11.
成才之路 · 语文 人教版 • 中国古代诗歌散文欣赏 路漫漫其修远兮 吾将上下而求索.
08 CSS 基本語法 8-1 CSS 的演進 8-2 CSS 樣式規則與選擇器 8-3 連結HTML 文件與CSS 樣式表
校本选修课 第三专题 西藏问题 北京师大二附中 李文燕.
正修科技大學教學發展中心 教師教學觀摩與經驗分享 電子工程系 張法憲副教授.
CH.12 CSS清單語法與格式設定.
HTML 語法教學 授課:彭穎聰 老師.
蘇軾詞的賞析
柯奕宏(06) 王予亨(13) 郭秉逸(15) 楊雯凈(23) 顏佑瑩(32)
第十五章 传播学调查研究方法.
HTML基本語法及文字 靜宜大學 資管系 楊子青.
DreamWeaver MX (V) 林偉川.
CT212 (02/03)-Network Programming and design
自然與生活科技領域 認識太陽能 蘇紋琪、石明玉.
 全能的天才畫家- 李奧納多‧達文西 (西元1452年-1519年) 指導老師:袁淑芬老師 製作人:饒佩芯.
DreamWeaver MX (II) 林偉川.
Ch01 HTML 5 資料格式 網頁程式設計.
Google協作平台.
網頁製作入門 電算中心 – 蔡京甫.
客戶端的檔案上傳 HtmlInputFile檔案控制項 上傳單一檔案 同時上傳多個檔案.
第 7 章 設定網頁背景與音樂.
SQL Stored Procedure SQL 預存程序.
R教學 安裝RStudio 羅琪老師.
網頁切換移轉 JS vs. ASP.NET.
Word與PowerPoint的結合 建功國小 陳旻杰 健行國小 張慧如.
HTML – 文字格式 資訊教育.
檔案與磁碟的基本介紹.
FTP檔案上傳下載 實務與運用.
認識我的故鄉_台中市.
網頁切換移轉 JS vs. ASP.NET.
第八 课 n l 教学.
W3C标准网页制作 主讲教师:张 涛.
網頁程式設計 本章投影片錄自HTML5、CSS3、RWD、jQuery Mobile跨裝網頁設計 陳惠貞 著 碁峰資訊股份有限公司出版
PLC-GPPW軟體使用教學 授課教師:張祖烈
網路程式設計期末project B 張芸菱.
UpToDate Anywhere 設定方法
HTML – 表格 資訊教育.
PowerPoint 2019/4/9.
第一個cordova project Cordova project建立與平台設定,均藉由cli(command line interface來完成 建立project請打開命令提示字元視窗應輸入下列命令 cordova create hello tw.edu.stust.mis.hello HelloWorld.
網路工具運用 講師:鍾詩蘋.
HTML – 超連結與圖片 資訊教育.
精忠报国  演唱:屠洪纲 作词:陈涛 作曲:张宏光  狼烟起 江山北望  龙起卷 马长嘶 剑气如霜  心似黄河水茫茫  二十年 纵横间 谁能相抗  恨欲狂 长刀所向  多少手足忠魂埋骨它乡  何惜百死报家国  忍叹惜 更无语 血泪满眶  马蹄南去 人北望  人北望 草青黄 尘飞扬  我愿守土复开疆  堂堂中国要让四方来贺.
Google協作平台+檔案分享(FileZilla+網路芳鄰)
網頁設計 清單設計 Instructor: Reporter:楊政勳 Date:
個人網路空間 資訊教育.
HTML基本語法及文字 靜宜大學 資管系 楊子青.
利用 EditorConfig 自訂文字編輯器設定
樂樂請假了 尊重的故事 資料來源:臺北縣國民小學品德教育手冊 故事來源:臺北縣國民小學品德教育手冊 網路小故事
第7章 使用CSS设置链接与导航菜单 经济管理学院.
PowerPoint 操作介紹 106 計算機概論
聽聽那冷雨---重點摘要 二愛 王煜榕.
基本指令.
網站的設計 HTML 超文本標記語言( Hyper Text Markup Language)
Dreamweaver 進階網頁製作 B 許天彰.
2018 Operating Systems 作業系統實習 助教:林欣穎 實驗室:720A.
Brief Guide of FrontPage
國立台灣大學 關懷弱勢族群電腦課程 By 資訊工程 黃振修
憲政與民主 應化3A 邱泓明.
WALLET. 電子錢包..
清單的CSS樣式.
DreamWeaver MX (IV) 林偉川.
若要查看更多祕訣、影片、說明和訓練,請瀏覽 aka.ms/officetips
古蹟知性之旅 我和新港奉天宮有個約 報告人:陳 映 竹 傅 湘 甯.
05 债务重组.
HTML基本語法及文字 靜宜大學 資管系 楊子青.
網頁製作 1032 數位教材 單元7 : 超連結 主講老師:徐培倫.
第五章 自訂佈景主題與文字處理 講授者:詹雅愔.
Develop and Build Drives by Visual C++ IDE
Presentation transcript:

本章重點 4-1 使用者導向設計 4-2 網頁組織結構 4-4 進階清單的變化功能 4-5 使用超連結(hyperlink)功能

使用者導向設計 HTML文件是透過一種所謂超連結的(Hyperlink)方式,它能將使用者輕易地導向您網頁文件中任何所指定的段落,或網路上任何指定的網站。

網頁組織結構 如何讓這些資訊有組織化,不會讓瀏覽者迷失在您的網頁迷宮中,那就必須依賴對各種網頁連結架構的充分認識了。

線狀架構 瀏覽者能夠循序欣賞瀏覽

連結成單獨一份的長篇文件

連結成包含多個檔案的複式文件

索引架構

樹狀架構 一般來講,樹狀架構的組織都比較龐大,通常運用在政府機關或大型企業。

星狀架構 不像樹狀架構必須回到上一層後才可跳到其他選項,也不用像索引架構般需回主目錄後才可進行其他選擇,能夠讓您在任何情況下都可以來去自如。

編號清單<ol><li> 網頁清單設計 編號清單<ol><li> <ol>和</ol>:為編號清單的起始與結束標記。 <li>:所要列表的項目,是一種非成對的標記。

項目清單<ul> 項目清單在每一項目條列之前,以符號來作為分項的標誌。它以<ul>和</ul>作為項目清單的起始與結束標記,而<li>標記則作為列表的項目。

選單式清單<menu> HTML中是以<menu>和</menu>標記來表示選單式清單,並以<li>標記作為列表的項目。

目錄式清單<dir> 目錄式清單和選單式清單相同,皆是在列表項目前加入圓點狀的項目符號。

進階清單的變化功能 改變編號清單樣式(使用type屬性) type=A:以大寫英文字母A、B、C….作為項目符號 type=I:以大寫羅馬數字I、II、III….作為項目符號 type=i:以小寫羅馬數字i、ii、iii….作為項目符號

除了編號清單可以改變編號樣式外,項目清單也能利用type屬性來改變項目的樣式。 預設值type=disc:顯現圓點 type=circle:顯現空心圓點 type=square:顯現實心方塊

定義型清單<dl><dt><dd> 定義型清單的特徵,在於其每一個要項之下還可以包含其要項內容,此內容則是以縮排的方式顯現。 <dd>標記必須跟隨在<dt>之後,不能單獨存在。

巢狀型清單 巢狀型清單和一般樹狀的排列模式雷同,它可以不斷的向下延伸,直到滿足您的需求為止。

使用超連結( hyperlink )功能 超連結基本的標記使用方法如下: <a href="資料路徑或檔名">關鍵字</a>

文件內的超連結方法 超連結的使用方法可以分為:單純本文內的段落跳躍、跨檔案的連結及跨網路的連結等。

在HTML文件中,如果要表達檔案的絕對路徑,必須寫出完整的磁碟機名稱與路徑。表示方式如下: 跨檔案與跨網路的超連結 在HTML文件中,如果要表達檔案的絕對路徑,必須寫出完整的磁碟機名稱與路徑。表示方式如下: file + : + 三條斜線(///) + 磁碟名稱 + 垂直線(〡)

設定連結文字色彩 設定連結文字的顏色標記主要會到四個屬性,這四個屬性都是編寫在<body>的標記中。