2014
Apr
04

網頁好讀版

ezHTML 是一個先文字的 HTML 編輯器,主要目的是要快速的撰寫 Blog 文章,並且容易維護與修改,功能類似 wiki 編輯器或是 markdown 。

Header: h1 ~ h6

h1 ~ h6 是 HTML Tag 中的標題,共有六種。

Header
  1. # h1 title
  2. ### h3 title
  3. #h1 h1 title
  4. #h6 h6 title

圖片 img

圖片的寫法是使用 #img,[] 裡面可以指定 img 的屬性,第一個數字 200 為圖片的寬。

img
  1. #img http://xxx.xxx.xx/a.png
  2. #img[200,100] http://xxx.xxx.xx/a.png
  3. #img[classname, alt="image alt"] http://xxx.xxx.xx/a.png

文繞圖,圖在左,文在右

text wrapping
  1. #img[left,200] /xxx/xxx.png
  2. #div 文字內容
  3. #imgEnd#
  4.  
這個文繞圖的範例,左邊是圖片,右邊是文字

文繞圖,圖在右,文在左

text wrapping
  1. #img[right,200] /xxx/xxx.png
  2. #div 文字內容
  3. #imgEnd#
  4.  
這個文繞圖的範例,左邊是文字,右邊是圖片

顯示程式碼

平常寫一些技術性文章時,很常需要顯示程式碼, 當然 ezHTML 也內建使用了 Google Prettify 來顯示程式碼,並且提供一個比較簡單的寫法,只要將程式碼用 #code[type]# 包起來, type 這裡就輸入程式的類別如:「js」,「php」,「html」,最後再使用 #codeEnd# 當結尾。

   #code[js] code#   
   function test() {  
      var a = 5;  
   }  
   #codeEnd#

程式碼顯示 Demo
Example
  1. function test() {
  2. var a = 5;
  3. }

表格

Table
  1. | *編號 | *數量 | *連結 | *修改 |
  2. | 001 | 1 | link | edit |
  3. | 002 | 2 | link | edit |
編號 數量 連結 修改
001 1 link edit
002 2 link edit

網頁好讀版