教育再公共化聯盟/實習/新手課表:修訂版本之間的差異

出自福留子孫
跳轉到: 導覽搜尋
屬性
HTML
第 18 行: 第 18 行:
 
===標籤===
 
===標籤===
 
*HTML中所有的內容都被包在起始標籤(opening tag)與結束標籤(closing tag)之中。
 
*HTML中所有的內容都被包在起始標籤(opening tag)與結束標籤(closing tag)之中。
 
 
*例如:
 
*例如:
 
<pre>
 
<pre>
<p>Hello World!</p>
+
<p>福留子孫</p>
 
</pre>
 
</pre>
 
*「< p >」即為起始標籤;「< /p >」則為結束標籤。<br/>
 
*「< p >」即為起始標籤;「< /p >」則為結束標籤。<br/>
第 82 行: 第 81 行:
 
type=    指示檔案的類別
 
type=    指示檔案的類別
 
content=  指示 http-equiv 屬性代表項目的值
 
content=  指示 http-equiv 屬性代表項目的值
 +
</pre>
 +
 +
===樣式===
 +
*樣式(Style)使用於style屬性中,透過CSS來控制和美化網頁的外觀和佈局。
 +
*兩組樣式指示以「;」間隔。
 +
*名與值以「:」相連。
 +
*例如:
 +
<pre>
 +
<p style="font-family:Arial; color:red;">福留子孫</p>
 +
</pre>
 +
*「font-family」與「color」為Style屬性的名;「Arial」與「red」分別為「font-family」與「color」的值,分別控制文字的字體與顏色。
 +
*常見的Style屬性的樣式指示如下:
 +
<pre>
 +
font-family: 字體
 +
font-size:  字的大小
 +
font-weight: 字有多粗
 +
text-align:  字的對齊方式
 +
color:      字的顏色
 +
width:      寬度
 +
height:      高度
 +
border:      邊框
 +
border-collapse:collapse 合併框線
 
</pre>
 
</pre>
  

2023年8月11日 (五) 13:26的修訂版本


分類功能
HTML網頁工具前端網頁設計
MediaWiki網頁工具提供線上編輯的開源軟體
SVG網頁工具向量圖形的編輯
Etherpad協作工具線上即時文字協作開源軟體
Jit.si Meet協作工具線上視訊平台
MySQL資料庫儲存資料的開源資料庫系統

HTML

  • http超文件傳輸協定(HyperText Transfer Protocol),其文件格式稱為HTML(HyperText Markup Language)。
  • HTML是一種超文本標記語言,用於建立網頁結構和內容的標記語言。使用不同的標籤、元素和樣式,可以組合成一個網頁。
  • Wiki是HTML的簡記法,一定會翻譯成HTML,所以可以從Wiki頁複製HTML段落。

標籤

  • HTML中所有的內容都被包在起始標籤(opening tag)與結束標籤(closing tag)之中。
  • 例如:
<p>福留子孫</p>
  • 「< p >」即為起始標籤;「< /p >」則為結束標籤。
  • 不同的標籤則對應到不同的顯示方式,HTML常見的標籤如下:
html     超文件(HyperText Markup Language)
head     文件頭
meta     對自身的描述
title    標題
body     本文

h1~h6    標題一級到六級(head)
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    宣告樣式(修飾一個超文件)
link     載入另一個檔,如 CSS 檔
span     文字小片段
div      區塊(division)
pre      保留原有斷行及排列之式(preserve)

form     表單

屬性

  • HTML不同的標籤中可以加入不同的屬性,提供額外的資訊。
  • 例如:
<a href="http://well-being-ng.net/">福留子孫超連結</a>
  • 「href」即為a的屬性,提供連結的資訊。
  • 屬性名稱後應接著「=」,並且屬性值應使用引號包覆。
  • 不同的標籤有不同的屬性可以使用,但有些屬性可以通用,HTML常見的屬性如下:
http-equiv= http項目
src=      圖照來源(source)
href=     跳往那一個連結(hyper ref)(hyper reference)
target=   跳往瀏覽器的那裡,預設值為本頁的本窗框,值_blank為新的空白頁。
style=    樣式屬性(修飾一個標籤)
width=    寬度,可以用點(px,pt)或長度(cm)或百分比表示
height=   高度,可以用點(px,pt)或長度(cm)或百分比表示
border=   邊框。
align=    靠左或調中或靠右
class=    引用 CSS 類別
id=       賦予標籤惟一的名字
xmlns=    指出 xml 的名字空間
type=     指示檔案的類別
content=  指示 http-equiv 屬性代表項目的值

樣式

  • 樣式(Style)使用於style屬性中,透過CSS來控制和美化網頁的外觀和佈局。
  • 兩組樣式指示以「;」間隔。
  • 名與值以「:」相連。
  • 例如:
<p style="font-family:Arial; color:red;">福留子孫</p>
  • 「font-family」與「color」為Style屬性的名;「Arial」與「red」分別為「font-family」與「color」的值,分別控制文字的字體與顏色。
  • 常見的Style屬性的樣式指示如下:
font-family: 字體
font-size:   字的大小
font-weight: 字有多粗
text-align:  字的對齊方式
color:       字的顏色
width:       寬度
height:      高度
border:      邊框
border-collapse:collapse 合併框線

MediaWiki

SVG

Etherpad

Jit.si Meet

MySQL