簡單的貼圖教學 @ :: 痞客邦 ::

說不定是今年度最後一篇文章了
請好好珍惜啊~

由於有幾個好學的網友們(雖然我打賭他們會看看就算了)
想學怎麼貼圖所以現在來教學幾個簡單的語法
頂多看起來很難事實上概念可以說是國小級的

好的教學開始: 請關掉你的手機我不喜歡上課被干擾

你要在文章中出現一張圖片
要怎麼讓電腦認為要在這個地方插入一張圖片呢?
這時就要下一個指令
(其實不能講是指令不過為了大家好理解就這樣講好了以下不再重述
請電腦狂人不要譙我)

那這個指令是啥呢?

超簡單
是　＜img＞　這一個tag(標籤)

這就是網頁最基本的語言啦　HTML
都是一堆與純文字組成的

簡單說明一下tag的意思在<>之間的東西
不會被你的瀏覽器判定為一般文字顯示出來
而是會去做這個tag該做的一些動作

像＜img＞這個很簡單當然就是image的意思
其他還有

啦啦
什麼的這些
看就知道是在幹嘛用的tag
當然這些tag都有他的作用　這邊就不多說了
如果你在<>中加入一些自己發明的tag　那他當然是一點用也沒有
像是　這些
一概是無意義的
如果你試出來有功能　那你家電腦一定是壞去了

我們現在針對＜img＞這個tag來教學吧

＜img＞這個tag裡當然有很多附加的東西要寫
你要指定你要插入什麼圖片　圖片多大　圖片的註解
當然你想不加也可以　HTML基本上是個不嚴謹到起笑的東西
你亂寫都不太會死

最基本的就是指定圖片位置啦
你不指定他那知道要插那張圖進來　只知道你要他插圖阿
所以　我們就要告訴它圖片的來源(source)

tag中就有了一些些小變化

　　＜img src="圖片的位置"＞

以無名小站為例
他的圖片位址都是長這個樣子的

　　http://pic3.pic.wretch.cc/photos/1/p/pen2/36/1130663820.jpg

要怎麼看這張圖片的位置
你可以去你的相簿　把圖按右鍵點開選內容
就可以看到上面有寫囉～

把這個圖片的位址放進你＜img＞的src裡就可以了
注意　不要去點到縮圖的
你放縮圖的小圖就笨到了喔～

那除了指定src 之外
當然還有其他很多可以加的
以下講幾個常用的屬性

border (邊框)
align (靠齊)
height (圖高)
width (圖寬)

以上面這張圖為例
如果我想把他擺進blog中
但只要寬450高336 加個3個象素的框
那要怎麼寫呢?

　　＜img src="http://pic3.pic.wretch.cc/ph
　　otos/1/p/pen2/36/1130663820.jpg"
　　 border="3" height="450" width=337"＞

寫不下拆成三行

簡單吧
簡單翻天～
你出師了　耶比～～

你也會加框了～　

這東西的好處在那兒？
大家是不是有試過在無名網誌中想插入一堆圖片過？

通常我如果要傳大量圖檔
為了不忍受反覆無名開網頁的等待
所以我都會先查好要上傳的圖片網址

反正先看縮圖的編號　記一下　先用記事本copy好

然後全部都一起先用記事本套好

再一次貼上基本編輯器
如果有圖要調整　再用網頁上的進階編輯器調整
快樂又方便喔～

Tip:
　通常你一起上傳的圖片會連號　或是差一兩號
　所以我會先看最開始的那一張跟最後那一張的編號
　一次加到滿　然後全部貼上　
　再用進階編輯去刪掉沒有這個網址　
　移掉被畫叉叉的圖片

　　點這邊接著看[ 進階的貼圖教學 ]