六年制學程/01/2013.10.08:修訂版本之間的差異
出自六年制學程
(→DS file) |
(→HTML重要的標記命令) |
||
第 40 行: | 第 40 行: | ||
===HTML重要的標記命令=== | ===HTML重要的標記命令=== | ||
<pre> | <pre> | ||
+ | 標籤 | ||
+ | ==== | ||
html 超文件(HyperText Markup Language) | html 超文件(HyperText Markup Language) | ||
head 文件頭 | head 文件頭 | ||
第 60 行: | 第 62 行: | ||
li 列表項目(list item) | li 列表項目(list item) | ||
− | style 宣告樣式 | + | style 宣告樣式(修飾一個超文件) |
span 文字小片段 | span 文字小片段 | ||
− | div 區塊 | + | div 區塊(division) |
pre 保留原有斷行及排列之式(preserve) | pre 保留原有斷行及排列之式(preserve) | ||
− | + | <!-- | |
frameset 設定多窗框組 | frameset 設定多窗框組 | ||
frame 窗框 | frame 窗框 | ||
center 調中 | center 調中 | ||
blockquote 引文,前後空一行,前面空兩格 | blockquote 引文,前後空一行,前面空兩格 | ||
− | + | --> | |
form 表單 | form 表單 | ||
+ | |||
+ | 屬性(用=連等號兩邊) | ||
+ | ==== | ||
+ | src= 圖照來源(source) | ||
+ | href= 跳往那一個連結(hyper ref)(hyper reference) | ||
+ | target= 跳往瀏覽器的那裡,預設值為本頁的本窗框,值_blank為新的空白頁。 | ||
+ | style= 樣式屬性(修飾一個標籤) | ||
+ | width= 寬度,可以用點(px,pt)或長度(cm)或百分比表示 | ||
+ | height= 高度,可以用點(px,pt)或長度(cm)或百分比表示 | ||
+ | border= 邊框。 | ||
+ | |||
+ | 樣式(用:連冒號兩邊) | ||
+ | ==== | ||
+ | font-family: 字體 | ||
+ | font-size: 字的大小 | ||
+ | font-weight: 字有多粗 | ||
+ | text-align: 字的對齊方式 | ||
+ | color: 字的顏色 | ||
+ | width: 寬度 | ||
+ | height: 高度 | ||
+ | border: 邊框 | ||
+ | border-collapse:collapse 合併框線 | ||
</pre> | </pre> | ||
2013年12月24日 (二) 23:16的修訂版本
目錄
製作每位同學的個人網頁
檔案編輯app
- ASTRO 文件管理器:內附「檔編輯器」,支援 UTF8 碼,文字編小。
- 文件大師:內附「文件大師文本編輯器」,預設中國的GB碼,也支援 UTF8 碼,文字較大。
- 文件管理器(資料夾及齒輪):內附「文本編輯器」,支援 UTF8 碼及多種編碼。
DS file
用來編輯和上傳網頁
- 「DISKSTATION」指的是伺服器、網站,俗稱「上」;「本地檔案」指的是你眼前這部平板電腦,俗稱「下」。
- 首頁檔通常檔名叫做 index.html 或 index.htm
- index.html 在「本地檔案」才能編輯修改;但必須在「DISKSTATION」中才能讓公眾透過瀏覽器來看。所以一定在要「本地檔案」和「DISKSTATION」兩者之間傳來傳去。
- 建立個人網頁:
- 在「DISKSTATION」中的 home 之下,建立一個資料夾叫「www」。
- 在「DISKSTATION」中的 6year 之下,找到 index.html 按久一點選「下載」,把它下載到「本地檔案」資料夾中。
- 在「DISKSTATION/home/www」之下放三張照片,並記下照片的檔名,如果檔名太難記,就改成較好記的名字。
- 在「本地檔案/dsfile」中找到 index.html ,按久一點選「開啟」,再接著選「檔編輯器」或「文件大師文本編輯器」或「文本編輯器」(資料夾及齒輪),將三個圖檔的檔名改成剛剛記下三個圖檔的檔名,編好之後按右上角的圖示存檔。然後按「回上一動」退出編輯器。
- 將剛剛存好的「本地檔案/dsfile/index.html」按久點選「複製」,然後複製到「DISKSTATION/home/www」之中。
- 去瀏覽器看結果。
瀏覽器
- 有預設瀏覽器和 firefox 。
- 在網址列打上「jendo.org/~同學姓名」即可看到個人網頁。
- 如果網頁有異動,就重刷一次網頁。
HTML語法
- 雙標記命令:一般由開始標記和結束標記構成一對,如:<×>....</×>其中的×代表標記命令。以上角括號及斜線均為英文半形。
- 雙標記合一:img(圖照)、br(換行)、hr(水平線)是開始標記與結束標記合一的,寫成<img />、<br/>、<hr/>
- 開始標記命令可以用「屬性」加以修飾,例如 img 標記可以有:
- src 屬性,指示圖的位置
- width 屬性,指示圖的寬度
- height 屬性,指示圖的高度
- 屬性名後面是屬性值,屬性名與屬性值之間用「=」相連。同標記內兩組屬性是用空白相隔開。
- 屬性值通常用一對單引號「'」或雙引號「"」包起來,如果屬性值當中不含空白,則引號通常可以省略;如果屬性值當中含空白,則引號絕對不可以省略。
class 屬性
引用已經定義的樣式。
style (樣式屬性)
HTML重要的標記命令
標籤 ==== html 超文件(HyperText Markup Language) head 文件頭 title 標題 body 本文 a 超連結(anchor) img 圖(image) p 段(paragraph) br 跳行(break space) hr 水平線(Horizontal Rule) table 表 tr 表內之列(table row) td 表內之格(table diamond) th 表內之格(table head diamond) ol 有次序的列表(order list) ul 沒有次序的列表(unorder list) li 列表項目(list item) style 宣告樣式(修飾一個超文件) span 文字小片段 div 區塊(division) pre 保留原有斷行及排列之式(preserve) <!-- frameset 設定多窗框組 frame 窗框 center 調中 blockquote 引文,前後空一行,前面空兩格 --> form 表單 屬性(用=連等號兩邊) ==== src= 圖照來源(source) href= 跳往那一個連結(hyper ref)(hyper reference) target= 跳往瀏覽器的那裡,預設值為本頁的本窗框,值_blank為新的空白頁。 style= 樣式屬性(修飾一個標籤) width= 寬度,可以用點(px,pt)或長度(cm)或百分比表示 height= 高度,可以用點(px,pt)或長度(cm)或百分比表示 border= 邊框。 樣式(用:連冒號兩邊) ==== font-family: 字體 font-size: 字的大小 font-weight: 字有多粗 text-align: 字的對齊方式 color: 字的顏色 width: 寬度 height: 高度 border: 邊框 border-collapse:collapse 合併框線
其他
- http 超文件傳輸協定(HyperText Transfer Protocol)
- 柏納李:HTTP 的發明人,在 1990年12月25日 實現第一次的 HTTP 傳輸,1991年8月6日第一個網頁伺服器上線。1994年柏納-李宣布全球資訊網完全免費的,不申請專利權,不徵收專利費,因此,人人都能輕易用上全球資訊網。
- 從 wiki 頁複製 HTML 段落