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

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

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



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

那這個指令是啥呢?

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



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




pen2 發表在 痞客邦 留言(7) 人氣()


留言列表

發表留言