Vivian Yeh - 跨領域轉職的軟體工程師
首頁
RD少女養成計畫
從今天開始的轉職計畫
RD少女日常
Vivian Yeh的 Premium
方案
關於
RD少女養成計畫
50
公開內容
為了追求可以窩在座位上、可以心無旁騖思考問題、座位可以亂七八糟沒關係、不需要到處哈腰點頭跑客戶,不用腳踩十公分、連妝都可以不用化的職場人生,文組少女毅然決然踏上RD的養成日常。
全部
跨領域轉職
學習資源&心法
專案管理 & 開發
JavaScript
CSS
HTML
RWD
Firebase
前端開發
TypeScript
全部內容
免費與付費
最新發佈優先
Vivian Yeh
2023/06/07
【前端開發】如何透過 CSS 實作段落的斷行效果,white-space 語法應用
說到 HTML 元素的換行效果,在前端有滿多種實作方式的最常見的方式是使用 <br /> 這個 HTML 元素來進行換行 ⋯⋯
#
CSS
7
留言
Vivian Yeh
2022/04/28
【自學程式】那些年你沒搞懂的 Flexbox 及實務應用技巧
在 Modern Web 的世界中,已經有非常多的套件、語法、框架,可以解決大部分網頁排版問題。 以我近期的觀察來說,在專案開發時,大部分公司會為了讓下一個接手、維護的開發者能更快上手專案架構,而採取原生的 CSS 寫法,而不是仰賴快速又方便的套件。
#
CSS
7
留言
Vivian Yeh
2022/03/23
【自學程式】好用的 CSS 偽類選擇器 :nth-child() 與 :nth-of-type()
相信透過之前的介紹,大家對於 CSS 選擇器(CSS selector)已經不陌生了,今天我們要來聊聊兩個在實務上非常好用的偽類(pseudo class )語法,他們分別是 :nth-child() 與 :nth-of-type(),在了解這兩個語法之前,我們首先要先來聊聊什麼是「偽類」呢?
#
CSS
5
留言
Vivian Yeh
2021/12/05
【CSS 教學】position 系列語法彙整,絕對、相對定位的開發、除錯技巧
不論是在基礎或是進階的版面排列,幾乎離開不了 position 系列的 CSS 語法,如果對於這些語法不熟悉,要快速完成畫面需求幾乎是不可能的,甚至會延宕整個團隊的開發速度(對,position 語法就是這麽重要)。
#
CSS
10
2
Grace Wang
喜歡
你好,文章中的好幾個範例都沒有圖喔
Vivian Yeh
2021/11/14
【自學CSS】min-width、max-width 到底怎麼用?響應式網頁應用解析
相信大家在一開始接觸 CSS 時,一定會很疑惑為什麼除了 width 外,還會有 max-width 及 min-width 語法呢? 當要開發響應式網頁時,到底要使用什麼語法來控制「斷點」?
#
CSS
12
留言
Vivian Yeh
2021/09/28
【CSS 教學】什麼時候該使用 margin 、padding?前端都該要懂的盒模型!
對於前端初學者來說,在切版時會出現很多規則、不規則的網頁區塊,這時候我們會嘗試用各種相對定位、絕對定位、margin 或是 padding 的方式來進行網頁區塊的推擠。
#
CSS
8
3
小耕的思緒遊記
喜歡
喔喔我了解了,我在學習 * { box-sizing: border-box; } 這個語法的時候課程有強調要在CSS的開頭就寫上去,原來是這個原因! 感謝Vivian解答! 妳寫的技術文章都很實用,期待看到更多好文!
Vivian Yeh
2021/09/07
【CSS 教學】inline、block、inline-block 使用時機講解
明明想要某個欄位的寬高為 200px,卻發現自己不知道為什麼怎麼更改都會改不動,又或者寬高更改了,卻沒有辦法與其他元素並列。 上述的狀況,通常都是在不熟悉 HTML display 特性而產生的狀況下才會出現⋯⋯
#
CSS
10
2
小耕的思緒遊記
喜歡
了解HTML標籤的預設屬性真的很重要! 記不起來的話可以查下面的網站 https://htmlreference.io/
Vivian Yeh
2021/07/31
【自學程式】如何調整網頁背景圖片大小?解決背景重複、圖塞不滿問題
在一個網頁上,會需要使用到圖片的地方有非常多處,像是品牌主視覺、橫幅廣告、側邊廣告、主要內容的預覽圖片、縮圖、背景圖片等。
#
CSS
10
留言
Vivian Yeh
2021/07/11
【自學程式】如何設定網頁的背景圖片?多層次背景圖、漸層背景教學
在初學網頁排版的時候,文字、段落、列表的排版可以說是比較好上手的,只要稍微透過margin、padding、border及文字顏色上調整,就可以輕易獲得一段美美的文字。 然而要去調整圖片的大小及其他相關效果,就不是那麼容易的一件事了,往往在開發時,都會出現圖片效果不如自己預期的狀況。
#
CSS
9
留言
Vivian Yeh
2021/06/10
【自學程式】什麼是CSS選擇器? 學習如何改變網頁內容的樣式
與HTML不同,CSS是專門修改網頁內容「樣式」的程式語言,也就是說你沒有辦法透過CSS去新增網頁的文字或是圖片等相關的內容,但你可以透過HTML新增網頁內容後,再使用CSS去修改他的樣式,例如⋯⋯
#
CSS
9
留言