怎麼選取到元素改變網頁原有外觀呢?本篇主要整理CSS選取器分類及CSS優先權 切版學習途中，你是否有這樣的疑問？ 要怎麼選才能選到我要的元素改變? 認識選...
組件實作 : Demo 一、前言 AJAX（Asynchronous JavaScript and XML）中文翻作「非同步的 JavaScript 與...
display 這個屬性在排版上非常好用，之後介紹三元運算子也會提到可以如何運用。主要在設定元素 顯示（如何顯示）或 不顯示（none），及其子元素的佈局， 直...
這篇文章簡單介紹一下Sass~ Sass 是什麼 ? Sass是一種CSS預處理器語言(CSS preprocessor)，可以讓開發者使用像是變數、函式、嵌套...
list-style-position 屬性讓我們可以決定記號是否應該被視為是文字的一部份，並且由此而決定記號的位置。這個屬性可能的設定值為 "in...
小斑
‧
2017-12-18
還記得前兩週我都在學習如何手刻RWD網頁，不只有許多的HTML結構要去注意。就連CSS樣式也希望能使用模組化的方式建構。總之，就是要讓code不要太冗長不好管理...
字體 font 系列 屬性 說明 語法 font-size 設定文字大小 font-size: 20px; font-weight 設定文字粗...
今天比較忙 就先簡單分享在網路上找的一些模板給大家參考 這對往後在開發網站前端很有幫助 http://develop-a-website.com/15-fr...
小斑
‧
2017-12-16
direction 屬性是用來設定文字的方向。可能的值為 'ltr' 與 'rtl'。 如以下範例： <!DOCTYPE html> <h...
小斑
‧
2017-12-11
text-indent 屬性是用來設定每一段的第一行前面要留多少空間。 text-transform 屬性是用來控制大小寫是如何展現的。可能的值包括：ca...
小斑
‧
2017-12-14
我在學習 flexbox 時，發現有好多容易混肴的排版屬性值，例如: start, flex-start, self-start 在 Chrome 的...
本篇介紹偽類中的狀態選取器:checked應用篇:做一個開關按鈕 :checked介紹 :checked是分類在本刊第4篇選取器 > 偽類別(pse...
1. 為什麼需要精靈圖 一個網頁中會需要很多小的背景作為修飾，若圖像過多服務器頻繁接收&發送會造成服務器壓力過大，將降低頁面加載速度 因此，為了有效減少...
身為前端工程師，除了要實作功能互動以外，還有很重要的就是視覺上的呈現。 在前期的開發階段，為了盡量讓產品的原型看起來有感覺一點，通常前端工程師自己就要先懂一些配...
前言 「重新認識 CSS」這個系列名稱的由來就如其名，我想要重新認識它。雖然以前就有學過 CSS，但這次想從 CSS Spec 中學到最原始的定義和內容，更加...
letter-spacing 屬性可用來設定每一個字母之間的空間。line-height 屬性可用來設定每一行之間的空間。 如以下範例： <!DOCT...
小斑
‧
2017-12-12
工作內容1 能熟練操作SEO並獲得搜索流量2 熟練html,css,asp及php程式語言，會使用常用CMS系統建站工具等3 網站架構動線規劃、條件優化4 產業...
免費授權圖庫 skitterphoto：以 CCO(Creative Commons Zero)授權釋出。除了可直接使用、也可以修改，甚至是用在商業用途上。...
情境 Flexbox 是 CSS3 的盒子模型(box model)，顧名思義它就是一個具有彈性和靈活性的盒子(Flexible Box)，這個模型讓排版變得容...
CSS 選擇器 選則器的功能在於讓瀏覽器知道樣式要套用在哪個或哪些元素中，主要依據選擇器的複雜程度分為基本選擇器和複合選擇器。本篇我們會介紹常用的基本選擇器，主...
CSS 的各種 transxxx (transition / transform / translate )，不熟時候常常寫到茫掉，來篇筆記分類／整理一下好方便...
Transform 變形 主要是讓目標元素變形，可以旋轉、歪斜、放大、縮小、移動元素有分成2D以及3D的部分，先來介紹 2D transform transf...
選擇器 (Selector) 似乎也稱為選取器，介紹幾個常用的選擇器 標籤選擇器 type selector：又稱型態選取器，就是之前舉例時修改標籤的樣式...
平行四邊形使用在網頁設計的時候，是為了讓頁面看起來更活潑更有動感。 首先用skew()來製作一個平行四邊形的按鈕。 <a href="#&quo...
基本的 樣式設定 / 排版定位 都已經難不倒你了嗎？那就接著要來玩玩動態的部分啦！一開始覺得寫 CSS 能讓醜醜的網頁變漂亮很療癒，而接觸了 CSS 的動畫控制...
為了安全，我覺得還是讓 li 之間保持一點社交距離好了，所以來講一下幾種做 li 分隔線的方法。 這之前你要先知道什麼是跟屁蟲選取器，以下的範例都會使用到。 範...
Day40 終極試煉 簡單小語 終極試煉拖了好久啊啊啊，工作忙，家裡忙，又有連假，一切都是藉口，小魯是不會多說的，寫這篇心得當下可是在花蓮民宿裡苦苦地寫，為的...
在 day2 中有提到，我的發文內容可能比較偏向基本，因是第一次參賽，目的希望在挑戰連續發文的 30 天中，更重要的是能從中學習並累積自己的前端技術。終於來到最...
小斑
‧
2018-01-02
承「與工程師的協作之路-那些年，我們一起混淆的CSS（一）」篇，講完position之後，今天要來跟大家介紹一個始祖級語法— float 剛接觸這個領域的時候，...
Day35 大俠漢堡 簡單小語 大俠愛吃漢堡包，純正牛肉真是好；香港市民添口福，吃完就是乖寶寶，看到這麼多的漢堡選單樣式，就立刻想到這個標語及經典台詞，這次練...
切版姐姐
東尼先生
Olivia
zhix6842
a0265392_lin
Yuri Tsai
Titangene
Taiming
Eudora
我是誰我在哪...
hokou
yowlonglee
Zombie@Dump
TerryYu
Wen Chien
iThome鐵人賽
看影片追技術