iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

7 Like 1 留言 6371 瀏覽

鐵人賽開發技術 DAY 40

30天掌握Sass語法系列第 36 篇

技術 Sass開發流程設計 - (10)Susy 版型種類介紹

這一次我想聊的是關於susy所提供的grid種類，因為他不單單只能設計RWD版型而已，一些常見的網頁版型設定也都有支援提供，後面如果有時間的話也會設計一個...

廖洧杰 ‧ 2013-10-25

6 Like 1 留言 4916 瀏覽

鐵人賽開發技術 DAY 24

作個網站吧！系列第 24 篇

技術作個網站吧！Web Font(2)-誰說icon不能放大

除了昨天記錄的線上字型以外，現在icon也可以直接利用轉檔功能把自己畫的icon“變成”網路的字型。不想多費力氣去做icon？網路上也有很多免費現成的可以使用...

tpodomoto ‧ 2013-10-24

9 Like 1 留言 9266 瀏覽

鐵人賽開發技術 DAY 39

30天掌握Sass語法系列第 35 篇

技術 Sass開發流程設計 - (9) Off-Canvas layout with Susy

這篇文章竟然花了我7個小時XDD 中間忘了存檔重打外，重新打一遍又發現到新的觀念，於是又越拖越晚...冏，不過終於開始講到我想分享的一些較深入的Sass設...

廖洧杰 ‧ 2013-10-24

9 Like 3 留言 10050 瀏覽

鐵人賽開發技術 DAY 23

作個網站吧！系列第 23 篇

技術作個網站吧！Web Font(1)-網頁也可以不一樣

網頁字型已經行之有年，國外大大小小的網站都可以看到不同字體顯示，只要連結檔案就能看到效果，多數文字再也不必依賴圖片製作，不但方便還減少檔案大小，一舉兩得～以下...

tpodomoto ‧ 2013-10-23

6 Like 2 留言 9002 瀏覽

鐵人賽開發技術 DAY 38

30天掌握Sass語法系列第 34 篇

技術 Sass開發流程設計 - (8) susy grid教學(2)

本日susy重點： 1.利用omega並排元素內容 2.透過isolation來達成Responsive image gallery grid 在以往我們在設...

廖洧杰 ‧ 2013-10-23

3 Like 1 留言 2594 瀏覽

鐵人賽開發技術 DAY 22

作個網站吧！系列第 22 篇

技術作個網站吧！Quickly Sass(4)-CSS無痛轉移Sass

既然開始學Sass了，以前的檔案當然也要趁機會轉成Sass，練習兼整理，一舉兩得～既然開始學Sass了，以前的檔案當然也要趁機會轉成Sass，練習兼整理，一舉...

tpodomoto ‧ 2013-10-22

10 Like 3 留言 18393 瀏覽

鐵人賽開發技術 DAY 37

30天掌握Sass語法系列第 33 篇

達標好文技術 Sass開發流程設計 - (7) susy grid教學(1)

由於行動裝置的逐步普及， Responsive Web Design(RWD)也逐漸變為市場趨勢，所以這裡也來聊一下關於RWD的Sass格線系統，在以前Sa...

廖洧杰 ‧ 2013-10-22

6 Like 0 留言 3310 瀏覽

鐵人賽開發技術 DAY 21

作個網站吧！系列第 21 篇

技術作個網站吧！Quickly Sass(3)-神器出動：Sublime text使用心得

撰寫Code的編輯器很多種，小到記事本大到一堆有的沒的都可以用。而我最近因為開始學著用Sublime text，覺得也很好用～於是推薦一下:D 以下簡略介紹一...

tpodomoto ‧ 2013-10-21

6 Like 2 留言 6309 瀏覽

鐵人賽開發技術 DAY 36

30天掌握Sass語法系列第 32 篇

技術 Sass開發流程設計 - (6) 如何逐步整合自己的Sass資料夾

在開發數個網站後，網頁設計師通常都會思考該如何化繁為簡地設計自己的開發流程，今天則就提供一些心法讓剛碰觸Sass的朋友了解該如何整合自己的Sass資料，範...

廖洧杰 ‧ 2013-10-21

5 Like 1 留言 4458 瀏覽

鐵人賽開發技術 DAY 20

作個網站吧！系列第 20 篇

技術作個網站吧！Quickly Sass(2)-神器出動：Fireapp使用心得

前陣子接觸Fire.app，是個製作網頁原型的協助工具，個人覺得很方便，想推薦給大家。以下紀錄一下使用心得：前陣子接觸Fire.app，是個製作網頁原型的協...

tpodomoto ‧ 2013-10-20

4 Like 0 留言 5698 瀏覽

鐵人賽開發技術 DAY 35

30天掌握Sass語法系列第 31 篇

技術 Sass開發流程設計 - (5) Sass設計資源整理

除了閉門造車設計Sass網站設計流程外，我自己也時常會去搜尋其他網頁設計師的Sass資源，再去從對方的設計風格和理念找出優缺，衡量是否該改善我自己撰寫Sa...

廖洧杰 ‧ 2013-10-20

4 Like 1 留言 2099 瀏覽

鐵人賽開發技術 DAY 19

作個網站吧！系列第 19 篇

技術作個網站吧！Quickly Sass(1)-少動點兒手：Sass使用心得

雖然年初就已經知道Sass, 但是實際學習與應用卻是在這一兩個月. 坦白說我自己一開始認為很難, 怕用了之後反而不會寫CSS, 以及編譯的問題而產生有點抗拒的心...

tpodomoto ‧ 2013-10-19

5 Like 1 留言 5731 瀏覽

鐵人賽開發技術 DAY 34

30天掌握Sass語法系列第 30 篇

技術 Sass開發流程設計 - (4) 排版流程(下)

延續昨天的版面，已將所有的大框架建立好了，這裡先來提自己的排版流程習慣： 1.我習慣先把大框架設定用好後，再來微調各元素間的距離。 2.在排網頁時，我會先將...

廖洧杰 ‧ 2013-10-19

1 Like 0 留言 3003 瀏覽

鐵人賽開發技術 DAY 18

作個網站吧！系列第 18 篇

技術作個網站吧！Beauty CSS(7)-CSS動一動

CSS3的特殊效果也是不得不提的功能之一, 有了它可以減少些jQuery撰寫, 對我來說相當方便. 以下紀錄一些用法, 若有誤還請指正, 謝謝. CSS3的特殊...

tpodomoto ‧ 2013-10-18

5 Like 3 留言 4399 瀏覽

鐵人賽開發技術 DAY 30

學習手機網站開發系列第 27 篇

技術 Slider Menu選單-Day 30

製作FB的選單效果。下面分享FB選單效果的插件，將相關附件崁入頁面中，在相關標籤作設定就會顯示出如FB選單的效果。 →SliderMenu中是指跳出的menu...

ramya ‧ 2013-10-18

7 Like 1 留言 3753 瀏覽

鐵人賽開發技術 DAY 17

作個網站吧！系列第 17 篇

技術作個網站吧！Beauty CSS(6)-CSS好方便

CSS最方便的地方之一在於圓角陰影等外觀上的設定，可以減少依賴圖片，達到讀取速度加快，重點是語法打一打就不用一直存圖縮圖啦xD以下紀錄一些外觀上面的設定。如有誤...

tpodomoto ‧ 2013-10-17

9 Like 1 留言 2829 瀏覽

鐵人賽其他技術 DAY 25

跟著感覺走，隨想的開發技術，堆砌了我的 IT 人生系列第 21 篇

技術喜歡打羽毛球嗎？球館空檔很難明確掌控嗎？把我作的網站推薦給你常去的球館吧！

這個網站省卻了學校管理人員很多麻煩，一上線就揪出貪瀆的警衛，回歸正常收費。已租借場地的球隊，一定不敢遲交續借費用，因為馬上有人替補而無通融餘地。尚未租借的球...

iknowlab ‧ 2013-10-17

2 Like 1 留言 3522 瀏覽

鐵人賽開發技術 DAY 29

學習手機網站開發系列第 26 篇

技術 Bartender插件-Day 29

在Navbar導覽選單加入泡泡提示。這個插件可以在Navbar新增提示泡泡。 demo：http://www.stokkers.mobi/valuables/...

ramya ‧ 2013-10-17

8 Like 2 留言 9570 瀏覽

鐵人賽開發技術 DAY 32

30天掌握Sass語法系列第 28 篇

技術 Sass開發流程設計 - (2) Sass結構規劃、全域變數設定

切完所有圖片後，就可以開始規劃Sass檔案了，當你今天新建立一個Sass專案時，裡面預設會有print、ie、screen的Sass檔案，第一次撰寫Sa...

廖洧杰 ‧ 2013-10-17

6 Like 0 留言 2684 瀏覽

鐵人賽開發技術 DAY 16

作個網站吧！系列第 16 篇

技術作個網站吧！Beauty CSS(5)-選擇器part3

今天是CSS小孩系列！（小孩系列是我自己取的...）我在寫網頁時常常遇到的問題是，當我想在一區塊裡某些部份作不同設定的時候，往往要再增加一個選擇器，而且只有這...

tpodomoto ‧ 2013-10-16

3 Like 0 留言 3920 瀏覽

鐵人賽開發技術 DAY 28

學習手機網站開發系列第 25 篇

技術圖片換頁插件-Day 28

顯示左右箭頭，讓使用者可以往前或往後可以用來如(圖片顯示)會顯示左箭頭或右箭頭讓使用往前或往後。作法： →到http://filamentgroup.com...

ramya ‧ 2013-10-16

11 Like 4 留言 5406 瀏覽

鐵人賽其他技術 DAY 24

跟著感覺走，隨想的開發技術，堆砌了我的 IT 人生系列第 20 篇

技術請問，做一個網站，大約要多少錢？多麼簡潔明瞭的庶民問句，你答的出來嗎？我有一個簡單的應對方針。

如果你在賣房子，有好奇心的友人會問你：「現在房價多少？」如果你在賣電腦，想添購電腦的友人會問你：「現在電腦一台多少？」如果你在包工程，有人會問嗎？知道怎麼問...

iknowlab ‧ 2013-10-16

4 Like 1 留言 14462 瀏覽

鐵人賽開發技術 DAY 31

30天掌握Sass語法系列第 27 篇

技術 Sass開發流程設計 - (1) 切圖、規劃Layout

關於Sass的基礎在前30天已經介紹得差不多了，但畢竟理論的東西要導入自己的實務開發流程始終會有陣痛期。所以之後的文章我會用Sass從無到有實際做一個版型出...

廖洧杰 ‧ 2013-10-16

7 Like 0 留言 2865 瀏覽

鐵人賽開發技術 DAY 15

作個網站吧！系列第 15 篇

技術作個網站吧！Beauty CSS(4)-選擇器part2

選擇器學不好，要飯要到老（誤）我認為學好CSS選擇器對於網站效率有很大幫助，當然這點我也還在學習當中。今天繼續紀錄CSS的選擇器，文章若有謬誤還請不吝指正m(...

tpodomoto ‧ 2013-10-15

6 Like 2 留言 6678 瀏覽

鐵人賽其他技術 DAY 30

快寫HTML靜態網頁系列第 27 篇

技術快寫：語法 + 框架 + API。靜態：動態的完成

快速回顧一下，為什麼要挑這些主題來構成這一系列的簡介文章。這系列的快寫 HTML 靜態網頁，分別就以下的特點來快寫：語法編輯器上的縮寫語法來快速擴...

逮丸逮丸 ‧ 2013-10-15

5 Like 2 留言 10124 瀏覽

鐵人賽開發技術 DAY 30

30天掌握Sass語法系列第 26 篇

技術 30天掌握Sass語法 - (30)inline-image()與Livereload介紹

上篇文章好像太早發了，導致系統沒更新，所以第30天煩請以此文章為主關於Sass的基礎知識，其實在這30天都講得差不多了，如果有興趣想再深入了解的話，可以...

廖洧杰 ‧ 2013-10-15

2 Like 0 留言 3028 瀏覽

鐵人賽開發技術 DAY 27

學習手機網站開發系列第 24 篇

技術 JQM內嵌(inline)清單&圖示清單-Day 27

將LIST和其他html內容在一起顯示。預設下通常list清單都會顯示全頁模式，下面作法是要將list和其他HTML內容混用，也可以達到多清單的樣式，每個ul...

ramya ‧ 2013-10-15

1 Like 0 留言 2420 瀏覽

鐵人賽開發技術 DAY 14

作個網站吧！系列第 14 篇

技術作個網站吧！Beauty CSS(3)-選擇器part1

選擇器學不好，要飯要到老（誤）我認為學好CSS選擇器對於網站效率有很大幫助，當然這點我也還在學習當中。以下是紀錄CSS的選擇器，文章若有謬誤還請不吝指正m(_...

tpodomoto ‧ 2013-10-14

2 Like 0 留言 5102 瀏覽

鐵人賽其他技術 DAY 29

快寫HTML靜態網頁系列第 26 篇

技術 Shower.js 與其他的HTML簡報工具

在前一篇簡介了很易用的 HTML 簡報，如果希望在簡報裡是比較多的照片為底圖，可能就不大方便，後來才發現已有一堆的 HTML 簡報工具可利用。一堆的...

逮丸逮丸 ‧ 2013-10-14

2 Like 0 留言 2708 瀏覽

鐵人賽開發技術 DAY 26

學習手機網站開發系列第 23 篇

技術 JQuery Mobile清單劃分兩層文字欄位-Day 26

將LIST清單，分為兩個欄位顯示兩個文字訊息。常用的LIST清單設計通常只有一個欄位+一個圖示來顯示資訊，下面作法可以分為兩個文字欄位來補充其他資訊。作法：...

ramya ‧ 2013-10-14

技術 Sass開發流程設計 - (10)Susy 版型種類介紹

技術 作個網站吧！Web Font(2)-誰說icon不能放大

技術 Sass開發流程設計 - (9) Off-Canvas layout with Susy

技術 作個網站吧！Web Font(1)-網頁也可以不一樣

技術 Sass開發流程設計 - (8) susy grid教學(2)

技術 作個網站吧！Quickly Sass(4)-CSS無痛轉移Sass

達標好文 技術 Sass開發流程設計 - (7) susy grid教學(1)

技術 作個網站吧！Quickly Sass(3)-神器出動：Sublime text使用心得

技術 Sass開發流程設計 - (6) 如何逐步整合自己的Sass資料夾

技術 作個網站吧！Quickly Sass(2)-神器出動：Fireapp使用心得