九藏喵窩V5

標題: HTML的結構(文章測試) [打印本頁]
作者: 椰子    時間: 2011-3-30 00:57
標題: HTML的結構(文章測試)
本文章最後由 椰子 於 2011-3-30 14:26 編輯

以下Html 代碼為高階使用者使用，初級入門請參考回覆第一篇的img代碼

<html> ... </html> 之間就是html的內容，有了這個語法就能界定這個是使用了HTML的文件了；
<head> ... </head> 的位置是用來放一些這個HTML文件的設定，而這個範圍內的內容是不會在瀏覽器內顯示出來的；
<body> ... </body> 就是這個檔案的重心，所有要顯示的內容都要放在這裡；
<title> ... </title> 是整個檔案的標題，會顯示在視窗最頂處的標題列。

<br> 這個標籤（tag）能使文章換行
<p> 這個也是一樣，不過它是用來分段的，所以分隔比較大；也可以<p> ... </p>來顯示

<p align="left">
這是用來設定該段落文字的對齊位置，而align="xxx"就是<p>的參數，這個是置左
<p align="center">
這個也是同上，把段落置中
<p align="right">
如此類推，這個當然是置右啦！
<p align="center"> .... </p> 也可以 <center><p> .... </p></center> 來代替

<pre> 這個是用來把文字的格式保存的標籤
<blockquote>這個可用來把該段文字往右縮排一段距離
<hr>這是分隔線標籤，水平分隔版面。也可以加上屬性：color、size、width、align、noshade

<img src="xxx">插入圖像，xxx為網址名稱

width 及 height
<img src="位置" width="數字" height="數字">
若果圖像不用width和height來指定其長闊，就會用回原來的大小，如果使用了，就會按長闊來放大縮小

alt
<img src="位置" alt="文字">
若果我們把mouse放在圖片上等待一秒，就會出現一行文字，這就是alt的功能了，可作補充、解釋之用。

border
<img src="位置" border="數字">
border是邊緣，可設定它的粗幼度。如果是 0 的話就會隱形

設定字體格式
<h1>文字</h1>
設定文字為標題，被Tag包著的字成為標題，會變得大起來、粗黑些。最細的是<h6>，最大是<h1>。


a) size
這是設定字體大小的參數
b) color
這是設定字體顏色的參數
c) face
這是設定字體字型的參數

文字的其他效果。
a) <b> ... </b>
這是用來把文字變粗
b) <i> ... </i>
這是用來把文字變斜
c) <u> ... </u>
這是用來把文字加上底線
d) <strike> ... </strike>
這是用來把文字劃掉
e) <sup> ... </sup>
這是用來把文字提高一些
f) <sub> ... </sub>
這是用來把文字下降一些
g) <tt> ... </tt>
這是用來把所有英文字母都變成一樣闊，像打字機的字一樣

超連結的運用
<a> .... </a>

<a href="網頁位置"> 表面文字 </a>
這是用來指示要連結的文件所在。



....這是2004年逛論壇留的資料，拿來測試文章留言，至於文章出處......不是很清楚(汗
作者: 椰子    時間: 2011-3-30 14:00
本文章最後由 椰子 於 2011-3-30 14:31 編輯

IMG代碼...BB代碼(BBcode)、Discuz!代碼
使用方法：將發文右上角的源碼打勾勾開啟將可看到

它是一種類似HTML的語法，可以為您的文章增加效果或格式化，您可以在文章發表的表格上方使用便捷的BB代碼按鈕。為了讓大家能認識並正確的使用語法，BB代碼必須要有起始標籤及相對應的結束標籤，以下是常用的BB代碼使用範例：

粗體:
  1. [b]粗體[/b]
複製代碼
斜體：
  1. [i]斜體[/i]
複製代碼
底線：
  1. [u]底線[/u]
複製代碼
歡迎加入九藏喵窩(點選此連結)(網頁超連結)：
  1. [url=http://www.dnaxcat.net/dnaxtalk/?fromuid=30]歡迎加入九藏喵窩(點選此連結)[/url](網頁超連結)
複製代碼

                               
登錄/註冊後可看大圖
(貼圖)：
  1. [img]http://statics.plurk.com/e3baa9d0d78c35e955a6b07c39f530fa.gif[/img](貼圖)
複製代碼
引言內容:[quote=作者]作者的文章內容...[/quote]←測試無效，可能是權限不足吧= w=

小型字體：
  1. [size=4]小型字體[/size]
複製代碼
大型字體：
  1. [size=9]大型字體[/size]
複製代碼
顏色(red)：
  1. [color=red]顏色(red)[/color]
複製代碼
(標籤結合應用)
有超連結的圖片

                               
登錄/註冊後可看大圖
  1. [url=http://www.dnaxcat.net/dnaxtalk/?fromuid=30][img]http://i209.photobucket.com/albums/bb294/cocona_photos/NEKOHOME/Signature%20Map/1234548082191.png[/img][/url]
複製代碼
小結：測試了一下，很多代碼是無效化(權限不足或未開放)
簡單列一下所有常用img代碼

  2. BB 代碼列表
  3. [b], [i], [u] 粗體 / 斜體 / 底線
  4. [color] 顏色
  5. [size] 大小
  6. [font] 字體
  7. [highlight] 高亮
  8. [left], [right], [center] 左對齊 / 右對齊 / 居中
  9. [indent] 縮進
  10. [email] Email Linking
  11. [url] 超級連結位址
  12. [thread] 主題連結
  13. [post] 文章連結
  14. [list] 列表 / 高級列表
  15. [img] 圖片
  16. [code] 代碼
  17. [php] PHP 代碼
  18. [html] HTML 代碼
  19. [quote] 引用
  20. [noparse] 停止解析 BB 代碼
  21. [attach] 附件

  23. [color=Red]請留意
  24. BB代碼必須要有起始標籤及相對應的結束標籤，以上範例皆只有起始標籤說明[/color]

複製代碼
其實這裡都有教...
我如何使用Discuz!代碼
作者: 星星喵    時間: 2011-3-30 21:44
連測試都這麼糟糕.......
作者: 浮雲浪犬    時間: 2011-3-30 22:00
是椰子~
一點都不意外(茶

我沒有喵頭可以換(跪)
現在哈啦可以發文了嗎?!
想開個樓@@!!
作者: 椰子    時間: 2011-3-30 22:27
連測試都這麼糟糕.......
星星喵 發表於 2011-3-30 21:44

                               
登錄/註冊後可看大圖


很正直呦~~>wo~*

是椰子~
一點都不意外(茶

我沒有喵頭可以換(跪)
現在哈啦可以發文了嗎?!
想開個樓@@!! ...
浮雲浪犬 發表於 2011-3-30 22:00

                               
登錄/註冊後可看大圖


可以吧，這裡的哈啦版又沒版主，不用問我啦~~哈喵喵(撇頭)
作者: 瓔    時間: 2011-3-30 23:03
那張圖真的好正(ㄗㄠ)直(ㄍㄠ)！
而且好像比之前的還正(ㄗㄠ)直(ㄍㄠ)耶！！

果然是正(ㄗㄠ)直(ㄍㄠ)椰阿....
作者: admin    時間: 2011-3-30 23:07
{:5_154:}  真想看-完整-的測試...
作者: 默貓    時間: 2011-3-30 23:12
還不夠完(ㄗㄠ)整(ㄍㄠ)嗎？XD

是說，之前發在V3的文章會轉過來嗎？
作者: GINSEI    時間: 2011-3-31 11:23
好久沒玩HTML了，只記得基本的，改天再來試。
作者: 憨喵    時間: 2011-4-1 19:05
感覺好複雜@@
(憨喵的腦袋記憶體容量不足,無法輸入)
作者: 夏小千    時間: 2011-4-2 16:23
椰子不糟糕~就不是椰子了
作者: Mr.茶    時間: 2011-4-3 21:21
HTML啊...建議只開放給有管理權限的人員，以免不必要的麻煩喔！



歡迎光臨 九藏喵窩V5 (https://dnaxcattalk.dnaxcat.com.tw/) Powered by Discuz! X3.3