iT邦幫忙

css相關文章
共有 1576 則文章
鐵人賽 自我挑戰組 DAY 9

技術 Day9 網頁前端-刻意練習(JQ選單)

Day9 金魚 JQ選單 簡單小語 之前練習往往都是在header上會花些時間,這次的刻意練習就選JQ選單來加深印象,雖然樣板差不多差異在其特效及RWD差異,...

鐵人賽 自我挑戰組 DAY 7

技術 Day 7 用 WordPress 佈景主題學 CSS 選擇器:進階篇

大家好,我是 Eric。昨天文章的最後,丟出了幾個問題,沒有辦法透過基本的選擇器來完成,又或者說,要透過基本選擇器來完成會變得非常麻煩。以「我的表格想要偶數列跟...

鐵人賽 自我挑戰組 DAY 8

技術 Day8 網頁前端-刻意練習(簡易表格)

Day8 金魚 簡易表格 簡單小語 練習表格一開始真的會搞不清楚欄跟列的排序方式,再慢慢練習後終於知道tr,th,td差異處,一開始看出還真的一頭霧水呢,表格...

鐵人賽 自我挑戰組 DAY 6

技術 Day 6 用 WordPress 佈景主題學 CSS 選擇器:基本篇

大家好,我是 Eric。 昨天我們正式進入佈景主題的核心之一,CSS。除了內嵌樣式之外,在網站開發時,最常用的仍然是 CSS 檔案,以及 <style&g...

鐵人賽 自我挑戰組 DAY 7

技術 Day7 網頁前端-刻意練習(會員登入)

Day7 金魚 會員登入 簡單小語 會員登入畫面的練習,增加了觸摸效果及使用者體驗,先前看Amos老師教學時以為不難,實作才發現很多觀念不足,例如如何放圖片到...

鐵人賽 自我挑戰組 DAY 5

技術 Day 5 WordPress 樣式客製化與 CSS:樣式介紹與佈景主題架構

大家好,我是 Eric。 第二到第四天的文章中,我們透過觀察 WordPress 佈景主題的檔案,了解了基本的 HTML 5 架構與語意化標籤。接著,在骨架完成...

鐵人賽 自我挑戰組 DAY 6

技術 Day6 網頁前端-刻意練習(綜合練習#2)

Day6 金魚 綜合練習#2 簡單小語 這次的練習花的時間長了點,主要就是各種不規則以及動畫的搭配上,花了較多時間,也練習了OffCanvas,Scroll...

鐵人賽 自我挑戰組 DAY 5

技術 Day5 網頁前端-刻意練習(綜合練習#1)

Day5 金魚 綜合練習#1 簡單小語 這次的練習發現許多細節在初學時沒有注意好,例如空間的配置以及padding及margin的應用,如何讓版面排起來增加可...

鐵人賽 自我挑戰組 DAY 4

技術 Day4 網頁前端-刻意練習(稀飯版+蓋版廣告)

Day4 金魚 稀飯版+蓋版廣告 簡單小語 這次多練習了偽元素before跟after,還記得當初看到Amos老師用這個功能,真的是一頭霧水看不懂,也很好奇這...

鐵人賽 自我挑戰組 DAY 3

技術 Day3 網頁前端-刻意練習(稀飯版)

Day3 金魚 稀飯版 簡單小語 依稀記得當初看到Amos老師說稀飯版就是吃飯一樣簡單,那時的我真覺得太扯了,要切出那樣的版面居然說是簡單,到這次刻意練習時發...

鐵人賽 自我挑戰組 DAY 2

技術 Day2 網頁前端-刻意練習(相對絕對定位)

Day2 金魚 相對絕對定位 簡單小語 定位的重要性不可言喻,一招可以有各種變化,釐清relative,absolute,fixed之間的差異及使用時機,套句...

鐵人賽 自我挑戰組 DAY 1

技術 Day1 網頁前端-刻意練習

Day1 學習前端的起源 起源 小魯今年28歲,從事FAE及技術支援類工作約3年,資訊系畢業但沒去寫程式,當初也不愛寫程式。   2020年COVID-19疫...

技術 CSS & CSS3 學習筆記重點

以下要分享一些從金魚腦切版中及自己在切版過程中學到的一些知識點。 https://ithelp.ithome.com.tw/users/20112550/iro...

技術 React三種使用CSS方法

React兩種使用CSS方法 一、在檔案中寫寫css的第一個作法 Header.js import React from "react";...

技術 CSS 讓 video 實現 fullscreen

由於 video 是 HTML 內置組建,不能通過強制改變 size 使 video 鋪滿元素。如果要實現 video 全屏效果就需要用到 CSS 的 obje...

技術 [Sass]造輪子-用@mixin做一個簡單的loading動畫

話不多說,先上成果! 思考迴路: 撰寫keyframes使每個點上下移動(transform),我們命名這個keyframe為waving 每個點都具備相同...

達標好文 技術 CSS - 網頁列印與樣式

今天要來介紹一個比較不常用的東西,那就是 CSS 中的列印,在以前常常會將網頁列印出來,所以經常會使用到這個屬性,時到今日,使用的時機越來越少,只有一些報表有用...

技術 CSS - Grid 介紹與使用

Gird 是一種 CSS 的網格系統,他出來也有一陣子了,直到最近突然想到我還沒認真看過XD,所以想說該來還債拉,這篇就跟大一起來學習一下如何使用 Gird,那...

技術 Sass/Scss 基礎知識 學習筆記

Sass/Scss是一個非常好用的預處理器,所謂預處理器,就是可以在我們轉變成CSS之前,更有結構性寫、簡潔、清晰且好維護的 CSS 程式碼,在大型專案中可說是...

技術 [鼠年全馬鐵人挑戰] Week15 - 超新手學前端 - Bootstrap 4 概念筆記

什麼是 Bootstrap 4 Bootstrap 是一種由 HTML、CSS 和 JavaScript 寫成的前端框架,可以更快更方便的開發網站Bootstr...

技術 [鼠年全馬鐵人挑戰] Week13 - 超新手學習筆記:如何開始撰寫 RWD

又過了一週啦~一樣是超忙的一週~~下班回家努力練習切版直播的作業,不過這次的版型比較複雜所以卡關了QQ真的是燒腦燒到一個極點這次的作業除了 PC 版之外,還需練...

技術 JS30 Day 2 - CSS + JS Clock 學習筆記

以下為原始檔 https://github.com/87JoJo/02---JS-and-CSS-Clock 這次的練習,是要做一個小時鐘,而重點在於CSS的撰...

技術 [鼠年全馬鐵人挑戰] Week 7-從別人的部落格(轉職歷程)領悟到學習應不疾不徐

從別人的部落格(轉職歷程)領悟到學習應不疾不徐 今天分享筆記之外的心境,最近因為開始工作,在學習的時間變的比較無法自由掌握。因此學習有些緩慢下來!! 那為什...

技術 CSS-Grid 學習筆記

今天也來分享一下,自己昨天從AMOS大大的直播,所學到的CSS grid知識,有誤的地方,歡迎指證並還請見諒,謝謝! CSS Grid有點線面的概念,可以應用在...

技術 [鼠年全馬鐵人挑戰] Week11 - 超新手學習筆記:CSS-container容器標籤

Hi~大家這周過的好嗎? 上週開始參加六角學院切版直播班,希望讓自已的切版能力越來越好但現在的程度還算是很新~所以希望能把在這八週學到的寫成筆記更加深印象~這週...

技術 [鼠年全馬鐵人挑戰] Week10 - 超新手入門:CSS - 文字的不同變化

Hi~~大家這週的過的好嗎?現在最好防疫就是待在家別亂跑吧~當然我也好好待在家好好寫文啦~雖然好燒腦(大誤XDD上星期介紹完 CSS 的基本語法後,今天來寫寫...

技術 [鼠年全馬鐵人挑戰] Week09 - 超新手入門:CSS 的基本語法

大家好啊~~又見面惹~ 不知道清明連假大家有沒有乖乖待在家防疫還是有出遠門走走呢? 四天連假只待在離家不遠的地方走走運動,其餘時間就是待在家休息 感覺待在家才是...

徵才 【均一平台教育基金會】 徵【軟體工程師】

團隊介紹 均一平台教育基金會(Junyi Academy Foundation,簡稱均一)是一個致力於「讓每一位孩子都有機會成為終身學習者」的非營利組織。 我們...

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

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

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

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