iT邦幫忙

六角學院相關文章
共有 106 則文章

技術 鼠年全馬鐵人挑戰 WEEK 13: CSS | 假的!假的!這一切都是假的!偽元素 - 基本用法

什麼是偽元素? 它不是網頁元素,但行為、表現又像元素一樣,可以用CSS操控。簡易來說它就是個分身術,常用的偽元素有::before、::after兩種。 ::b...

技術 鼠年全馬鐵人挑戰 WEEK 12: 提升切版速度!Emmet原來可以這樣用!

最近參加了六角學院的切版班,想要提升自己的切版速度,分享幾個我常用的方式。如果有更好或覺得不錯的方法,可以留言分享喔! 需要你們打開我的新世界 基本用法 !=&...

技術 鼠年全馬鐵人挑戰 WEEK 11: 水平垂直置中、排版黑魔法 CSS-Flex

在還沒認識Flex前我的水平垂直置中招式,永遠都只有這幾招,line-height+margin auto或用postion來設定,但每次遇到的狀況還不一定能用...

技術 鼠年全馬鐵人挑戰 WEEK 10: 這時我看見他的背影,我的淚很快地流下來了。 box-shadow

還記得國中時,老師國文課時上到朱自清-背影,雖然內容不多,但內容卻十分豐富,國中時我還是位懵懂的少年,不經世事的孩子,對文章的真情未必有深入的感受及透澈。僅僅瞭...

技術 鼠年全馬鐵人挑戰 WEEK 09: 月亮圓又圓,用 border-radius 讓你圓又圓

雖然離中秋節還很遠, 已經想烤肉了XD ,但每次抬頭仰望星空,看到月亮一點一滴的變化,讓我心中掀起小波瀾,心中思考著要如何讓月亮長存,而不是只有黑夜。 如何使用...

技術 鼠年全馬鐵人挑戰 WEEK 08: head裡面到底在寫什麼?我怎麼看不懂?

剛開始學HTML時,都從body裡的內容開始學,很少用到head裡面的標籤,當打開別人的網頁時,看到head怎麼寫得滿滿的,看到就頭昏眼花 ,於是就激發了筆者的...

技術 鼠年全馬鐵人挑戰 WEEK 07:優化SEO- 語意化標籤!讓別人看懂你在寫什麼!

什麼是語意標籤?? 為了讓標籤(Tag)更具意義,已加強文件的結構化,讓搜尋引擎更清楚瞭解,可以更清楚表現網頁中每個區塊的設計目的。 為什麼要用語意標籤? 可...

技術 鼠年全馬鐵人挑戰 WEEK 06:優化SEO- 將 h1 圖片取代文字!

首先我們要先知道什麼是SEO? 沒有SEO,人們只有5.59%的機會找到你 SEO為什麼重要?讓人們看見你 以Google的角度而言 :Google不斷的更...

技術 鼠年全馬鐵人挑戰 WEEK 05:CSS為什麼老是吃不到?讓我們來瞭解CSS權重!

以前我在寫css的時候,常常發現沒寫錯但為什麼沒反應?然後開始陷入debug迴圈,後來才發現是權重出了問題,我想這也是大家都經歷過的痛吧! 在剛開始寫CSS的時...

技術 鼠年全馬鐵人挑戰 WEEK 04:人要衣著,佛要金裝!用CSS為網頁穿上衣服

如果說html是人,css就是衣服。俗話說:人要衣著,佛要金裝。穿搭得宜,宅男都會變型男無誤。 首先我們先在css資料夾下建立一個style.css,然後在ht...

技術 [鼠年全馬鐵人挑戰] Week05 - 21天效應,養成良好習慣

Hi~大家又見面啦 這次要來分享有關於21天效應~ 會想分享此主題是剛好前幾天看了六角學院的洧杰老師分享的這篇文章: 21 天培養習慣挑戰賽 - 我健康到爆炸啦...

技術 [鼠年全馬鐵人挑戰] Week 3-網頁排版筆記: 一份完整的作品所需要的元素

在練習與找工作中遇到卡關了。沈寂了一些時間,再度回來了。 一份完整的作品集,所需的元素,不外乎 UX/UI 使用者體驗/介面,還包含了許多技術面 HTML5...

技術 鼠年全馬鐵人挑戰 WEEK 03:CSS盒模型-box-model

什麼是box-model? 意思是在 CSS 裡面,html 的每個元素都可被視作為一個盒子,然後可以針對這個盒子去做調整 Margin -負責調整 元素與元...

技術 鼠年全馬鐵人挑戰 WEEK 02:瞭解Html標籤及特性-標籤下的好,架構沒煩惱!

瞭解Html標籤及特性 每個Html標籤都有其功能及特性,或許很抽象。我用遊戲來做譬喻,Html標籤就像是遊戲中的職業有各種功能,而屬性就像遊戲中的公會,每個職...

技術 鼠年全馬鐵人挑戰 WEEK 01:無經驗非本科技轉職前端歷程

Photo by Pixabay on Pexeles正在看著文章的大家們,這是小弟第一次參加鐵人挑戰賽,也是開啟我的文章生涯,再請大家不吝嗇的指教!ヽ༼ಢ_...

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

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

鐵人賽 自我挑戰組 DAY 26
網頁學習紀錄 系列 第 26

技術 鐵人賽 Day26 首次參加六角學院同學會

今年最令我期待的活動之一-六角學院三週年同學會!在二月中註冊了六角學院網頁設計師的課程,中間經歷了孩子誕生、陪伴太太坐月子、新手奶爸的生活...就這樣過了七個多...

鐵人賽 Modern Web DAY 7

技術 Firebase Functions - 實現 Serverless(下)

上一篇已經了解 Functions 可以如何應用,接下來我們就嘗試運用 Functions 來做一個可以上傳圖片並得到圖片網址與 metadata,範例是參考...

鐵人賽 Modern Web DAY 7

技術 Firebase Functions - 實現 Serverless (上)

Firebase Functions 是 Firebase 服務中的其中一個功能,利用程式碼將這些事件透過 Functions 來處理並得到回應,典型的使用範例...

鐵人賽 Modern Web DAY 7

技術 MarkMan - 高效的設計稿標註與測量工具

MarkMan – 馬克鰻是一款方便又高效的標註工具,可以節省設計師在設計稿上添加和修改標註的時間,簡單又易用的介面和工具,很快就能上手,除了設計師可以使用,工...

鐵人賽 Modern Web DAY 7

達標好文 技術 validate.js - 輕鬆完成表單驗證

validate.js 是一個方便用於表單驗證的 JavaScript 函式庫,透過 validate.js 你可以更簡單且完整的處理表單驗證的問題,那就來介紹...

鐵人賽 Modern Web DAY 7

達標好文 技術 moment.js - 關於時間的一切

在前端開發時經常會遇到需要處理日期或是時間的問題,而在 JavaScript 撰寫上經常都會需要用很多函數來處理與轉換,因此推薦大家使用 moment.js。m...

鐵人賽 Modern Web DAY 7

技術 部落格第三方服務介紹

前幾篇我們講了 hexo 快速生成部落格的方法,而部落格除了基本的文章發布之外,還可以加入一些第三方服務,來讓部落格更有互動性,這篇就來介紹一下部落格常見的第三...

鐵人賽 Modern Web DAY 7

技術 Hexo - 前端也能建置部落格!佈署篇

前幾篇我們對於 hexo 做成部落格並客製一些樣式有基礎的了解了,而既然是部落格,就是要放到網上讓大家可以來看自己想要分享的內容,所以這篇就來介紹如何把現有的內...

鐵人賽 Modern Web DAY 7

技術 Hexo - 前端也能建置部落格!修改樣式篇

上一篇對於自訂變數已經有基礎的了解了,接下來我們就用這些變數來做一些判斷並修改樣板與新增樣式,讓部落格更客製化、更豐富。那就開始介紹囉! 首頁內容調整 首先從首...

鐵人賽 Modern Web DAY 7

技術 Hexo - 前端也能建置部落格!自訂變數篇

接下來這兩篇要來讓部落格越來越可以改成自己想要的樣子,所以我們會講到自訂變數與修改樣式兩個部分,hexo 提供相當多種類的變數來讓我們透過這些變數增加一些內容在...

鐵人賽 Modern Web DAY 7

技術 Hexo - 前端也能建置部落格!安裝與建置篇

Hexo 是一款基於 Node.js 的網誌框架,之所以這麼多人在使用,是因為它能夠快速、簡單的建置屬於自己的部落格,且包含許多強大的功能。Hexo 可以使用...

鐵人賽 Modern Web DAY 7

技術 Yarn - 解決 npm 痛點

Yarn 是一個新的套件管理工具,以提供的功能面向來說,和大家熟知的 npm 是差不多的,但 npm 的安裝與套件快取通常都需要花費不少時間,而 Yarn 提供...

鐵人賽 Modern Web DAY 7

達標好文 技術 Sourcetree - git 的 GUI 管理軟體

雖然在 VSCode 與 github 整合以後,使用指令來進行版本控制已經變得非常方便,但有時候可能還是記不住指令,或是新手入坑比較不了解指令,這種時候就可以...

鐵人賽 Modern Web DAY 7

技術 原來 Github Gist 還可以... (下)

前一篇主要講了 gist 在開發的方面可以使用的功能,而 gist 除了使用在分享或下載原始碼檔案以外,還有其他的功能可以提供非開發者也能使用,像是拿來做筆記,...