Design News

網頁設計新知

新手必知!HTML語法教學—項目符號篇

Sep 30, 2022
「文字編輯器」之於網頁設計來說是一個重要的文章編輯工具。
在專案執行過程中,我們常接收到許多客戶的提問便是關於HTML語法的使用,
在這篇文章中將整理出於文章編輯時,最常使用到與「項目符號」編輯相關的HTML語法做參考喔!


一、項目符號
請以<li>標籤做為開頭
〔實例〕
原始碼模式實際呈現樣式
<li>項目1
<li>項目2
<li>項目3
  • 項目1
  • 項目2
  • 項目3

二、圓點清單
欲使用圓點清單,請以<ul>....</ul>做包裝,...代表您所想要置入的文字
原始碼模式實際呈現樣式
<ul>
<li>項目1
<li>項目2
<li>項目3
</ul>
  • 項目1
  • 項目2
  • 項目3

★★★TIP★★★
如想要在圓點上做一點小變化,即可在<ul>的標籤中加入一些參數,會有一些意想不到的效果!
原始碼模式實際呈現樣式
<ul type=disc>
  • 這是一般的小圓點
<ul type=circle>
  • 這是空心的小圓點
<ul type=square>
  • 這是實心正方黑點


三、數字清單
若不想使用圓點,而是使用數字時,請將<ul>處改為<ol>即可。

原始碼模式實際呈現樣式
<ol>
<li>項目1
<li>項目2
<li>項目3
</ol>
  1. 項目1
  2. 項目2
  3. 項目3

★★★TIP★★★
如想要在數字上做一點小變化,即可在<ol>的標籤中加入一些參數,會有一些意想不到的效果!
原始碼模式實際呈現樣式
<ol type=A>
  1. 這是A
  2. 這是B
<ol type=a>
  1. 這是a
  2. 這是b
<ol type=I>
  1. 這是I
  2. 這是II
<ol type=i>
  1. 這是i
  2. 這是ii


您也可以參考鉅潞科技客戶中已經有自行維護文字編輯器頁面的實績案例唷!
茂旭資訊科技有限公司
群益期貨|黃傳盛期貨資訊網
維格醫美集團


更多網頁設計作品,請由此進入!➠按此
想了解更多網頁新知,請由此進入!➠按此



鉅潞科技 ◆ 網頁設計的專家
我們提供客戶客製化網頁設計RWD網頁設計、AWD網頁設計、手機版網頁設計、虛擬主機租用、線上金流串接超商物流串接、簡訊系統串接、資料庫整合、電子發票串接、關鍵字行銷、......等多項服務。
為您提供多樣化的服務,替您的網站開啟全新風貌!