iT邦幫忙

鐵人檔案

2022 iThome 鐵人賽
回列表
Modern Web

關於SASS/SCSS 系列

Web 已經蓬勃發展了許久,因為本身學習的領域跟資訊相關,web也碰過一點點,想透過這次的機會學習一個對我來說新的工具來使用。

鐵人鍊成 | 共 30 篇文章 | 1 人訂閱 訂閱系列文 RSS系列文
DAY 11

[DAY11]明明是關於SASS/SCSS,為甚麼我都只用SASS呢?

前情提要 作為一個新手小白,SASS和SCSS兩個對我來說都是全新的領域,因為他們具有一定的關聯性,所以當初決定主題的時候才想說應該可以同時進行。 認識不一樣...

2022-09-25 ‧ 由 weiiiiiiii 分享
DAY 12

[DAY12] SASS計算機

前情提要 經過了這幾天的學習,重新檢視的時候突然發現,SASS彷彿有內建計算機的感覺,而這個東西的使用時機非常廣泛。 實際測試內建計算機功能 |加減乘除注意事...

2022-09-26 ‧ 由 weiiiiiiii 分享
DAY 13

[DAY13] SASS顏色函數(2)

前情提要 前幾天就學習關於SASS函數的運用,學到RGB,RGBA,MIX函數的用法。對之前的有興趣的也可以去看看第七天文章。 HSL functions |...

2022-09-27 ‧ 由 weiiiiiiii 分享
DAY 14

[DAY14]SASS巢狀結構

前情提要 如同標題所說,單純用CSS的結構來完成架構的話,每次class的開頭都會要一直寫重複的東西。 巢狀結構 |巢狀的優點|有了巢狀,我們以後改父選擇器的...

2022-09-28 ‧ 由 weiiiiiiii 分享
DAY 15

[DAY15]SASS 函式function

前情提要 在SASS裡面有非常多的函數,有之前介紹過的顏色函數,也有數字函數,列表函數,三元函數等等。之後如果有機會有時間的話可以再仔細來看看其他的函數。 正...

2022-09-29 ‧ 由 weiiiiiiii 分享
DAY 16

[DAY16]Compass 來了!內建神奇小功能介紹

前情提要 在架設網站的過程中,不管是網路上的,你自己畫的,或是拍照的圖檔無法避免的,你一定會有要放圖片的時候。在CSS這個成熟的語言下,當然可以支援圖片。今天來...

2022-09-30 ‧ 由 weiiiiiiii 分享
DAY 17

[DAY17]設定自己的reset.sass

前情提要 為甚麼會有reset的出現?它其實因應的是CSS檔案,大家都知道,css的出現主要是美化html,可以多一些自己的風格。但是在不同的瀏覽器下渲染出來的...

2022-10-01 ‧ 由 weiiiiiiii 分享
DAY 18

[DAY18]@Mixin + @content + @media = RWD(1)

前情提要 標題上我為甚麼打了一些看不懂的東西哩?先想想一個概念,現在人手一機根本不值得一提,更多數的人可能有不只一部手機跟無數個電子設備裝置,能拿來瀏覽網頁的裝...

2022-10-02 ‧ 由 weiiiiiiii 分享
DAY 19

[DAY19]@Mixin + @content + @media = RWD(2)

前情提要 標題上我為甚麼打了一些看不懂的東西哩?先想想一個概念,現在人手一機根本不值得一提,更多數的人可能有不只一部手機跟無數個電子設備裝置,能拿來瀏覽網頁的裝...

2022-10-03 ‧ 由 weiiiiiiii 分享
DAY 20

[DAY20]SASS用@if+@mixin畫三角形

前情提要 在每個程式碼當中,條件式if跟else幾乎沒有不存在過。今天用@if+@else加上之前的@mixin,畫好多好多三角形。 正文 |If Else再...

2022-10-04 ‧ 由 weiiiiiiii 分享