!『嵐設』免費電子報訂閱募集中!

在下方輸入您的Email訂閱就可收到本部落最新文章資訊喔!

Delivered by FeedBurner

      今天設計嵐來分享一個技巧,這個技巧實用性相當高,尤其是對於和設計嵐一樣在經營部落格,時常分享語法教學文章時,可以用到,而且也有許多人問過設計嵐相關的問題,這裡利用本文一次回答吧!

1.首先,在文章中置入文字框的作法:

a.將游標放在文章中要插入文字框的地方,然後切換至HTML編輯器模式(由於各家blog的發表文章介面有所不同,大家可以根據同樣原則進行操作,在此設計嵐以Pixnet說明)

1.jpg 

上圖1:游標放置在適當處

上圖2:點選上方工具列的『編輯HTML原始程式碼』按鈕

b.在編輯畫面中輸入以下程式碼或是將以下程式碼複製、貼上後,再進行修改。

 

‧在上方框內點一下已全選原始碼

‧CTRL+C進行複製的動作(由於許多部落格都有鎖定無法按右鍵,所以複製動作請用鍵盤快速鍵)

‧在HTML原始碼編輯模式下貼上至適當處

c.貼上之後可以進行以下設定:

i.上方原始碼中的cols代表字元寬度,表示文字框的一列要顯示幾個字元,各位可依需求設定,數值越大文字框就越寬。

ii.上方原始碼中的rows代表要顯示幾列文字,各位可以自行設定,例如3代表顯示3列,超過3列以外的內容就以捲軸方式顯示。

d.貼上並且修改參數完成後請點選畫面左下角的『更新』回到文章編輯畫面,就可以看到文字框了。(如下圖)

 1.jpg

e.接著在文字框上連點兩下左鍵,就可以輸入文字框的內容。

2.jpg 

 

到這邊,各位就學會了在部落格文章中加入文字框的方法。

2.接著說明如何製作游標點一下就自動選取文字框內所有內容的作法:

a.複製以下的原始碼:

‧在上方框內點一下以全選原始碼

‧CTRL+C進行複製的動作(由於許多部落格都有鎖定無法按右鍵,所以複製動作請用鍵盤快速鍵)

‧在HTML原始碼編輯模式下將原始碼貼在<textarea>的<>中即可

b.同上述作法切換到HTML原始碼編輯模式中

c.將上述原始碼貼至<textarea cols="50" rows="3" 原始碼貼在這這裡 >,記得是貼在<>中

d.完成後點選左下角『更新』回到文章編輯畫面

      以上兩個重點,就是如何在文章內置入文字框以及點一下就可以全選文字框內容的作法,對於時常分享程式碼相關文章的部落格站長應該相當實用,不妨參考一下。

 

創作者介紹

『嵐設』-設計教學部落

設計嵐 發表在 痞客邦 PIXNET 留言(6) 人氣()


留言列表 (6)

發表留言
  • 販頭
  • 昨天試了一整晚,發現使用mac電腦無法順利更換語法
    最後還搞到部落格都被我弄掛無法連上..><"
    整個網頁人氣值還變成0,嚇得我臉都綠了..><"
    我看關於語法的東西還是要有台pc好一些..^^
    真要謝謝你熱心及細心的教學~
    不然販頭這個部落格新手肯定會被這些語法給...搞死...XD
  • @@?...那現在一切還好嗎???

    設計嵐 於 2010/04/23 17:26 回覆

  • 販頭
  • XD..忘了報告結果
    一切安好^^
  • 那就好..XD..

    設計嵐 於 2010/04/23 22:40 回覆

  • skycielo
  • 啊啊!!我就是在找這個~>////<感動~

    嘿~嵐大的貼紙我帶走囉!^^

    以後請多指教也是~
  • 3Q~~^^....以後也要請你多多指教喔!!!

    設計嵐 於 2010/06/12 16:32 回覆

  • ~昕麻咪~
  • 超棒ㄉ教學~
    撕你ㄉ貼紙來貼囉~~~
    你分享ㄉ教學超實用ㄉ辣!!感謝~~~
  • 不要客氣喔.^^...有問題歡迎一起討論喔!!!

    設計嵐 於 2010/10/11 23:30 回覆

  • 雨匠
  • 雖然我可能要看個兩次才能了解(我看到電腦上的字就會自動頭暈XD)

    不過這好東西當然要大推特推啦!!

    謝謝分享啦!!!
  • happyplay19
  • 請問我希望我的文章可以被複製內容要怎麼操作 謝謝