iT邦幫忙

css相關文章
共有 709 則文章

技術 [紀錄] Day2 切版練習筆記

切版練習日期: 2020/02/14 觀看影片 : CssCoke - "金魚都能懂的網頁切版 : 網頁頁尾版塊 NO006" &&...

技術 [鼠年全馬鐵人挑戰] Day 2-網頁排版筆記: 修練前的寶物

暨上一篇學習遇到低潮期,搜尋網友的#技術文章分享 在iT邦幫忙,發現這篇「金魚都能懂網頁設計入門」 Amos 老師分享的技術文,說到筆記學習方法 「XMind」...

技術 [紀錄] Day1 切版練習筆記

2020/02/12 觀看CssCoke大大的Youtube金魚也懂的網也切版,"金魚都能懂的網頁切版 : 超通用橫式版面 NO005" 跟...

徵才 【新北市徵才】前端工程師- 需求Vue.js

【給正在看此職缺的你 / 妳】 我們不會去在意您的背景 / 學歷 / 科系,我們在乎是您對於工作上的心態與想法,我們對於技術的觀念要求會比較嚴格,相對的您也能...

徵才 【台北市】前端工程師(近捷運松江南京站)-APO

我們需要您具備以下能力: 1、從事前端開發2年及以上,精通各種前端技術,包括HTML/CSS/JavaScript/Node.JS等 2、具備跨終端的前端開發能...

技術 CSS線性漸層文字如何寫?

概念: 1.先用linear-gradient 在background 做出漸層效果 background: -webkit-linear-gradien...

技術 WordPress 教學:如何制作【平滑感】的 CSS 輕陰影?

有時要把陰影調整得非常 “Smooth 順滑” 是一件不輕鬆的事情,如果沒有受過正規的學術訓練,尤其容易弄巧成難看的陰影,雖然這非常主觀,但不妨多參考國外的優...

技術 【CSS筆記】實現等高欄位

第一種:border 解說:利用中間欄位的border-left與border-right來實現視覺上的等高效果,但缺點很明顯:「左右兩邊內容超出中間欄位時,會...

技術 要開始使用 Bootstrap 4 前,我們先了解幾個它的通用模式吧

前情提要:讓我們站在巨人的肩膀上,如何在專案中導入 Bootstrap 4 並客製它 ★首先這篇文章適合以下背景的人閱讀: 熟悉 HTML、CSS 知道如何...

技術 淺談BEM CSS

淺談BEM CSS-CSS設計模式與架構 前言 BEM是Block Element Modifier的縮寫, BEM 是一種為了讓CSS Class 更好維...

技術 讓我們站在巨人的肩膀上,如何在專案中導入 Bootstrap 4 並客製它

程式設計的世界有一句俗話叫做,不要重複造輪子,意思就是說,別人已經寫好了的程式,就不要再自己重複寫了,除非是想要練習,想要了解原理,讓自己將來也有機會為別人造...

鐵人賽 Modern Web DAY 30
重新認識 CSS 系列 第 30

技術 重新認識 CSS - 總結 & 系列目錄

前言 「重新認識 CSS」這個系列名稱的由來就如其名,我想要重新認識它。雖然以前就有學過 CSS,但這次想從 CSS Spec 中學到最原始的定義和內容,更加...

鐵人賽 自我挑戰組 DAY 30
從門外漢到前端新手 系列 第 30

技術 Day30 CSS:Transform: translate

Transform是CSS中,用來改變視覺格式化模型(visual formatting model)的各種型態,且它具有三維的概念,可以聲明元素的三維視覺效果...

鐵人賽 Modern Web DAY 30

達標好文 技術 學習路徑懶人包 - CSS 選取器學習地圖

經歷了29天的 CSS 選取器的洗禮,感謝各位的訂閱、支持與觀看,不知道大家對於 CSS 選取器是否有變的更加熟悉了呢?今天就讓我們來快速地回顧一下這 29 天...

鐵人賽 Modern Web DAY 29

技術 :root 根目錄選取器 - 叫你阿爸出來講

這個選取器應該是所有選取器裡面最特別的了,且目前這個選取器使用的地方還滿受限的,先來瞭解一下這個選取器的名字吧,root 顧名思義就是「根」的意思,網頁的「根」...

鐵人賽 影片教學 DAY 29

技術 金魚都能懂的這個網頁畫面怎麼切 : 拼拼版重構

大家好~ 我是 Amos,這次要跟大家分享的是切版的教學,如果您本身對於 HTML & CSS 的基礎還不了解的話,建議您可以先看去年鐵人的基礎教學 本...

鐵人賽 Modern Web DAY 29
重新認識 CSS 系列 第 29

技術 重新認識 CSS - z-index & stacking context

前言 「重新認識 CSS」這個系列名稱的由來就如其名,我想要重新認識它。雖然以前就有學過 CSS,但這次想從 CSS Spec 中學到最原始的定義和內容,更加...

鐵人賽 自我挑戰組 DAY 29
前端新手進化史 系列 第 29

技術 flex 7

文章將陸續整理並更新至個人部落格。 flex 有自己專屬的對齊屬性,vertical-align、text-align 甚至 float 都是叫不動...

鐵人賽 自我挑戰組 DAY 29
每天來點 CSS Specification 系列 第 29

技術 話說 Media Query 是什麼呢?(下)

Media feature 以下列出各種面向的 Media feature,一般來說較常使用的可能是有關於設備的顯示區域大小,應用在響應式網站時非常有用,除此以...

鐵人賽 自我挑戰組 DAY 29
從門外漢到前端新手 系列 第 29

技術 Day25 CSS:Position

position是用來定位元素的屬性。它是指定top、left、right、bottom的數值,來決定元素的位置。而它的定位是依照基準來位移,基準依positi...

鐵人賽 影片教學 DAY 28

技術 金魚都能懂的這個網頁畫面怎麼切 : 快速版面拼拼樂

大家好~ 我是 Amos,這次要跟大家分享的是切版的教學,如果您本身對於 HTML & CSS 的基礎還不了解的話,建議您可以先看去年鐵人的基礎教學 本...

鐵人賽 Modern Web DAY 28
重新認識 CSS 系列 第 28

技術 重新認識 CSS - visibility

前言 「重新認識 CSS」這個系列名稱的由來就如其名,我想要重新認識它。雖然以前就有學過 CSS,但這次想從 CSS Spec 中學到最原始的定義和內容,更加...

鐵人賽 自我挑戰組 DAY 28
前端新手進化史 系列 第 28

技術 flex 6

文章將陸續整理並更新至個人部落格。 vertical-align、text-align 甚至 float 都是叫不動 flex items 的,fle...

鐵人賽 Modern Web DAY 28

技術 :disabled & :enabled 表單用僞類選取器 - 一眼看穿那些不能按的按鈕

介紹了這麼多針對一班網頁標籤的選取器之後,總算我們可以進入到針對表單的選取器了,針對表單的選取器其實還不少,但是目前來說除了 :checked 之外,可能比較有...

鐵人賽 自我挑戰組 DAY 28
每天來點 CSS Specification 系列 第 28

技術 話說 Media Query 是什麼呢?(中)

倘若不斷向深處扎根,就能茁壯成長 - RM 前言 昨天我們提到了 Media query 的構成以及意義,了解到在對不同設備有不同的樣式設定時可以使用 Me...

鐵人賽 自我挑戰組 DAY 28
從門外漢到前端新手 系列 第 28

技術 Day28 CSS:Float

Float浮動屬性 float的使用,通常是想在版面上做出文繞圖的效果,但也可以應用在元素的左右對齊。float屬性有下列定位特性: 讓元素脫離normal...

鐵人賽 Modern Web DAY 27
重新認識 CSS 系列 第 27

技術 重新認識 CSS - overflow

前言 「重新認識 CSS」這個系列名稱的由來就如其名,我想要重新認識它。雖然以前就有學過 CSS,但這次想從 CSS Spec 中學到最原始的定義和內容,更加...

鐵人賽 自我挑戰組 DAY 27
前端新手進化史 系列 第 27

技術 flex 5

文章將陸續整理並更新至個人部落格。 上一篇文章 中說明了 flex 屬性是 flex-grow、flex-shrink、flex-basis 三個屬性...

鐵人賽 Modern Web DAY 27

技術 :nth-of-type() & :nth-last-of-type() - 你覺得燒腦但其實根本不燒腦的選取器趴兔

總算...金魚都能懂的 CSS 選取器 講了20幾篇,總算可以講到這個大家都很有興趣的 :nth-of-type 選取器了,看到這邊又要再再再老話一句了 ( 夠...

鐵人賽 自我挑戰組 DAY 27
從門外漢到前端新手 系列 第 27

技術 Day27 CSS:Display

在認識了normal flow中BFC與IFC的概念後,我們要來認識以這兩個佈局規則為基準的display屬性。display屬性也有特殊的佈局如flex及gr...