iT邦幫忙

css相關文章
共有 1841 則文章
鐵人賽 Modern Web DAY 11

技術 Day11::我所知道的 CSS重構 第二章瞭解串接

第二章 瞭解串接 什麼是串接? 串接(cascade) 是瀏覽器用來決定樣式如何套用到元素上的方法。有許多樣式可以套用到同一個元素上,當樣式沒有依照預期的方法被...

鐵人賽 Modern Web DAY 10

技術 Day10::我所知道的 CSS重構 第一章重構與架構

開始要求自己的程式碼的乾淨與可視程度之後被前輩推薦了一本書接下來幾天會以這本書為主的閱讀筆記,筆記會節錄書中的片段文章有興趣的朋友可以買來看看,這本書真的蠻不錯...

鐵人賽 Modern Web DAY 9

技術 Day09::我所知道的 CSS動畫

CSS也能做動畫?沒錯,CSS也能做動畫! 在看到CSS繪圖之後我在同樣的Pen裡頭又看到了會動的簡單小動畫又激起我的好奇心!然後我就去Google了 要用CS...

鐵人賽 Modern Web DAY 8
挑戰 CSS 30 天 系列 第 8

技術 day8_direction

direction 屬性是用來設定文字的方向。可能的值為 'ltr' 與 'rtl'。 如以下範例: <!DOCTYPE html> <h...

技術 好想工作室 Web Camp 第 15 梯招生

我是 Chris,從 2017 年起在好想工作室擔任 Web Camp Mentor 至今,培訓許多屆的 Web Camp 學員,這次我們要招收 Web Ca...

鐵人賽 Modern Web DAY 7
挑戰 CSS 30 天 系列 第 7

技術 day7_cursor

今天比較忙,先簡單放上一些內容 滑鼠游標圖案加上 style="cursor:pointer" 即可 其他滑鼠游標圖案,參考

鐵人賽 Modern Web DAY 1

技術 為什麼我用:hover 滑鼠放在圖片邊緣會一直閃?

前言 大家好,我大概都是直接從問題點出發,並寫記錄我的解決方式,但不一定是最好的解決方法,所以還煩請大大提點了 問題情況 我有用 hover 讓我圖片滑過鼠標時...

鐵人賽 Modern Web DAY 8

技術 Day08::我所知道的 CSS Grid Layout

CSS Grid Layout又被稱為網格佈局 簡而言之就是將畫面切割成若干方格再依照想要的位置把方塊放進去! 會使用到的屬性有 display:grid gr...

鐵人賽 Modern Web DAY 6
挑戰 CSS 30 天 系列 第 6

技術 day6_color

color (顏色) 屬性可設定一個元素的顏色。此屬性可以有以下三類的設定值: 十六進位值 RGB 碼 顏色名稱 範例如下: <!DOCTYPE...

鐵人賽 Modern Web DAY 6
重新學習網頁設計 系列 第 6

技術 DAY 6. CSS 選擇器 Selector (實際範例)

DAY 6. CSS 選擇器 Selector (實際範例) 在前面幾天我們陸陸續續地複習了幾個常用的CSS 選擇器 Selector我將在這篇中使用table...

鐵人賽 Modern Web DAY 7

技術 Day07::我所知道的 CSS設計模式與架構之BEM

這次分享的是BEM BEM分別是B=>Block E=>Element M=>Modifier Block 區塊網頁是由多個區塊組合自成一區在...

鐵人賽 Modern Web DAY 6

技術 Day06::我所知道的 CSS設計模式和架構之OOCSS

從開始切版,我最容易遇到的問題就是⋯ 扣很髒很亂今天打的程式碼睡一覺醒來後就完全看不懂程式碼在寫些什麼切版都用不一樣的標籤,今天用header明天用top後天用...

鐵人賽 Modern Web DAY 5

技術 Day05::CSS畫圖好好玩

之前在CodePen上面有看見許多使用CSS製作圖案的Pen當時看到覺得很神奇也很佩服,沒想到可以使用CSS做到這樣的事情 用CSS進行製作時,我們會需要使用到...

鐵人賽 Modern Web DAY 5
挑戰 CSS 30 天 系列 第 5

技術 day5_float&clear

float (浮動) 屬性可達成文字繞著一個圖案顯現,可能的值為:left、right、和 none。float:left; 使圖案浮動於左邊。float:r...

鐵人賽 Modern Web DAY 4
挑戰 CSS 30 天 系列 第 4

技術 day4_border 其他樣式

此篇介紹關於 border 的其他樣式,包含: **border:**若四個邊框屬性一樣,可用 border 屬性來描述(一行即可宣佈所有邊框的屬性)。**b...

鐵人賽 Modern Web DAY 4

技術 Day04::Bootstrap學習心得

剛開始接觸Bootstrap的時候剛好處於3跟4版本交替的時候3的資料才看沒多久4就出來了 文件資料有看沒有懂,知道的會用的也只有row跟col,而且還用得很落...

鐵人賽 Modern Web DAY 4
重新學習網頁設計 系列 第 4

技術 DAY 4. CSS 選擇器 Selector (二)

selector:nth-child(an+b) 選取符合偽類別an+b規則的元素an+b中的n為系統自動抓取值,無法人為控制,而a與b則為數字使用範例說明會更...

鐵人賽 Modern Web DAY 3
挑戰 CSS 30 天 系列 第 3

技術 day3_border-style

border-style 可以用來指定邊框的樣式。 如以下範例: <!DOCTYPE html> <html> <head&g...

鐵人賽 Modern Web DAY 3

技術 Day03::我所知道的 CSS選擇器

CSS的選擇器種類非常多,它們到底有哪些功能呢?剛開始學切版的時候因為實在搞不懂選擇器的用法和功能所以我的選擇器全部都是使用#ID ... class是什麼?跟...

鐵人賽 Modern Web DAY 3
重新學習網頁設計 系列 第 3

技術 DAY 3. CSS 選擇器 Selector (一)

對於後端程式起家的我, 以前我對CSS的選擇器selector大概就只知道id、class、*,一直到前17年初我真正踏入前端的領域後才知道原來選擇器可以有這麼...

鐵人賽 Modern Web DAY 2
每日文章推薦 系列 第 2

技術 Day 2 怎麼看

閱讀技巧 標題有關鍵字就看 有些文章標題很爛 但是內容很好 還有的文章不知道為啥標題會跟別的文章很像 如果以為是同一篇文章就會少看一篇 很不方便 有...

鐵人賽 Modern Web DAY 2
挑戰 CSS 30 天 系列 第 2

技術 day2_background

挑戰 CSS 第二天,練習基本與重要的背景屬性:background-color 和 background-image 範例如下: <!DOCTYPE h...

鐵人賽 Modern Web DAY 1
挑戰 CSS 30 天 系列 第 1

技術 day1_連接樣式

在網頁上連接的預設樣式為藍色,且有下劃線。改變此預設的樣式之範例: <!DOCTYPE html> <html> <head&...

鐵人賽 Modern Web DAY 2
重新學習網頁設計 系列 第 2

技術 DAY 2. CSS 特定度 Specificity

很抱歉 Day 2 並沒有承接著Day 1的內容原因是我在思考內容時總會聯想到許多東西, 而那些東西都讓我想好好地複習、更新且該篇核心內容並不足以成為一篇文章,...

徵才 日商公司招募企業內部員工(正社員):IT工程師

日商公司招募企業內部員工(正社員):IT工程師11/27、11/28將來台灣開辦選考會,有興趣的人,歡迎留言哦!雇用形態:正社員※入社後2ヶ月の試用期間あり。た...

徵才 PHP軟體工程師(工作地:台中市)

工作內容:依據任務分組負責軟體系統的程式撰寫、版本測試及上線後的維護工作,確保系統正常運行。 技能要求: 熟悉PHP、MariaDB(或MySQL)、Apac...

徵才 【日商公司】徵➀前端工程師➁HTML碼編(網頁製作)

【公司簡介】沖縄県最大的網路媒體在台灣設點!主要從事網路行銷専門的公司。數位行銷、Web網站制作、SNS等活用、有日本国内、海外,有効果的行銷、提升販賣等實績。...

鐵人賽 自我挑戰組 DAY 18
30 天 CSS 隨手筆記 系列 第 18

技術 30 天 CSS 隨手筆記 - 第 18 天 - UX 相關的眉角 ( 2/3 )

主要參考 CSS SECRETS 這本書裡面的內容作筆記~ 可滾動的提示 我自己是個很遲鈍的使用者 =艸=不知道大家有沒有類似的經驗,還記得之前我一直找不到在...

鐵人賽 自我挑戰組 DAY 17
30 天 CSS 隨手筆記 系列 第 17

技術 30 天 CSS 隨手筆記 - 第 17 天 - UX 相關的眉角 ( 1/3 )

主要參考 CSS SECRETS 這本書裡面的內容作筆記~ 添加點擊的感應範圍 現在使用手機瀏覽網頁的人越來越多了,在頁面的設計上,當然也要更考慮在小螢幕上的...

鐵人賽 Modern Web DAY 30
CSS 實戰心法 系列 第 30

技術 CSS 鐵人賽的結束與接下來的研究

相較於 Javascript 來說,CSS 的演進速度算是非常緩慢的,主要原因當然是瀏覽器的相容性,瀏覽器不太能因為新的特色加入而毀了以前所建置的網站。 在這個...