iT邦幫忙

好想工作室相關文章
共有 347 則文章
鐵人賽 Modern Web DAY 22

達標好文 技術 Day22:小事之 Media Query

Media Queries 中文翻為『媒體查詢』,作用在偵測輸出裝置,它是由一個媒體類型(media type)與零到多個用於檢查特定條件的媒體功能(media...

達標好文 技術 把要的元素留下來的 Array 陣列方法 filter()

Array 33 媽媽說,蘋果要挑大顆又漂亮來拜,神明才會保佑我們。 map()和filter()常常被稱為最好用的兩個陣列方法,之所以好用,有一個原因是我...

鐵人賽 Modern Web DAY 21

達標好文 技術 Day21:小事之 CSS Reset 與 CSS normalize

為什麼會想介紹 CSS Reset 與 CSS normalize ? 因為在很久很久以前(喂~)。咳!重來。 在 W3C 制訂 HTML 與 CSS 規格時,...

鐵人賽 Modern Web DAY 9

達標好文 技術 Day09:小事之 HTML lang Attribute

今天要開始來說說網頁相關的東西,不過因為已經很多大大們寫了非常基礎且完整的文章,所以這次所有講到的 HTML、CSS應該都會偏比較冷門,很可能久久才會遇到一次的...

鐵人賽 Modern Web DAY 15
新手也能懂的JS30 系列 第 15

技術 JS30-Day15-LocalStorage

Day15-課題內容 今天我們要將資料從頁面中的程式碼儲存到Web瀏覽器的儲存空間當中。如此一來,本來存入程式碼當中的資料,就不會因重新整理頁面或者關閉瀏覽器而...

鐵人賽 自我挑戰組 DAY 21

技術 JS 隨意修、刪、改的陣列 Array 方法 splice()

Day 21 這邊刪一下、那邊加一下,阿不,從後面改起!主管,可不可以不要這樣玩來玩去嗎? splice 中文為拼接。可以藉由刪除原來有的元素並/或加入新元...

鐵人賽 Modern Web DAY 16

技術 Day16:小事之 HTML table

HTML <table> 元件代表表格數據──換句話說,就是透過二維資料表來呈現資訊。早期 table 是同時拿來做網站排版與資料呈現,在 html...

鐵人賽 Modern Web DAY 20

達標好文 技術 Day20:小事之 CSS 權重 (css specificity)

在學習 CSS 的時候,一定會先認識什麼是 html element、什麼是 class、什麼是 id,什麼是 css 的 inline 寫法。了解基本的 cs...

鐵人賽 自我挑戰組 DAY 22

達標好文 技術 JS 將陣列 Array 重新排列的 sort()

Day 22 一堆樸克牌攤在眼前,要照花色排還是大小來排?隨你高興。 sort()是個很好用的陣列方法,凡是要把陣列裡面的元素,照我們想排列的方式重新排列都...

鐵人賽 Modern Web DAY 17
前端新手村 系列 第 17

達標好文 技術 前端新手村 Position 定位

「當你迷惘的時候,就回到原點想一想」-中華一番 蘭飛鴻 前言 網頁前端新手村系列文章,宗旨並不在技術本身的教導,重點放在技術與技術之間的脈胳關係。讓零碎的網...

鐵人賽 自我挑戰組 DAY 10

技術 JS 如何把陣列 Array 或元素清空和刪除

Day 10 好好的吃頓飯也是一種優雅。刪除也是。 「如何把陣列或元素清空」也要寫一篇? 妳當牛肉麵在寫嗎?自從有了這本「JavaScript 大全」當枕頭...

鐵人賽 Modern Web DAY 28

技術 Day28:小事之 jQuery 選擇器

jQuery 是一個快數、小巧、功能豐富的 JavaScript Open Source library,主要是用來操作 DOM ,包含快速選取一個或多個來做一...

鐵人賽 自我挑戰組 DAY 7

技術 JS 如何讀取和寫入陣列 Array 元素

Day 7 只要有資料,都會有 CRUD ,那陣列呢? CRUD 是什麼? 能吃嗎?? CRUD 分別代表:建立 Create, 讀取 Read, 更新 U...

鐵人賽 Modern Web DAY 13

技術 Day13:小事之 HTML viewport 與 meta tag

前面為了講 dir 岔太遠了,再回來 HTML 上面繼續說吧~今天要介紹的是 meta。 HTML meta tag 的功能是用來提供網頁資訊給瀏覽器、搜尋引...

鐵人賽 Modern Web DAY 27

技術 Day27:小事之 Transition 與 Animation

CSS3 中有兩個用來做動畫的屬性,一個是 Transition,另一個是 Animation 差異比較 CSS3 差異 Transition 在...

鐵人賽 自我挑戰組 DAY 15

技術 JS 從陣列 Array 尾端新增元素的 push()

Day 15 有付出一定有收穫,有pushㄧ定有增加,但是要排隊喔~ 介紹陣列方法的第一天,想先請大家看一下底下的這張圖,在上一篇,我們依 JavaScri...

鐵人賽 自我挑戰組 DAY 19
Typescript 初心者手札 系列 第 19

達標好文 技術 【Day 19】TypeScript 介面(Interface) v.s. 型別別名(Type Alias)

昨天初步介紹了 TS 介面以及如何宣告,但昨天在研究介面的時候,心中一直有個疑惑,介面怎麼和之前提到的型別別名(Type Alias)有點像,究竟有什麼差別呢?...

鐵人賽 自我挑戰組 DAY 4

技術 JS 創建與宣告陣列 Array

Day 4 總是要出來見世面的,但不講名字怎知你是誰? 這次的鐵人賽,參考書籍有可拿來當枕頭的大犀牛「Javascript 大全」和「你所不知道的JS」系列...

鐵人賽 自我挑戰組 DAY 25

技術 JS 把陣列 Array 轉成字串的 toString()

Day 25 我不想理你是歐洲人、美洲人、非洲人或哪國人,我就是要說中文。 常常聽到人家說 JavaScript 是弱型別語言,剛開始學程式的時候真的有點一...

鐵人賽 Modern Web DAY 6
前端新手村 系列 第 6

達標好文 技術 前端新手村 Block 和 Inline 排版

「當你迷惘的時候,就回到原點想一想」-中華一番 蘭飛鴻 前言 網頁前端新手村系列文章,宗旨並不在技術本身的教導,重點放在技術與技術之間的脈胳關係。讓零碎的網...

技術 Good Morning, Functional JS (Day 30)

標題 Good Morning,其實是希望本系列能為 Functional Programming 學習雲霧中透進一絲微光 會寫本系列文章,主要是因為想要...

鐵人賽 Modern Web DAY 17

技術 Day17:小事之 HTML table responsive

Table 很方便用來做資料的呈現,但是當需要在各種裝置都能正常顯示的情況下,Table 的使用就很讓人傷腦筋了。 比較常用的 Table RWD 方式有兩種:...

鐵人賽 Modern Web DAY 30

技術 Day30:小事之 心得、目錄與推薦

心得與感謝 感謝這次一起參加鐵人賽的好想工作室夥伴,真的覺得有跟你們一起參加才能寫完三十天。還要謝謝在這裡與在FB替我加油打氣的大家。也謝謝 Amos 跟我討論...

鐵人賽 Modern Web DAY 22
前端新手村 系列 第 22

技術 前端新手村 Transition

「當你迷惘的時候,就回到原點想一想」-中華一番 蘭飛鴻 前言 網頁前端新手村系列文章,宗旨並不在技術本身的教導,重點放在技術與技術之間的脈胳關係。讓零碎的網...

鐵人賽 自我挑戰組 DAY 27

技術 JS 找出元素索引值的陣列 Array 方法 indexOf()

Day 27 那一排,都是穿黑衣戴口罩的,去幫我找出搗亂的。抱歉,我只能給你 -1 因為連我們偶爾都會穿黑衣戴口罩。 終於,我們要進入ECMAScript...

鐵人賽 Modern Web DAY 5

達標好文 技術 無障礙網站之 HTML 屬性介紹:tabindex

TL;DR 本篇文章學習之重點: 瞭解讓功能可以使用鍵盤操作功能的重要性 瞭解怎麼透過鍵盤瀏覽網頁 瞭解 tabindex 的用法 Foucs 焦點 什麼是...

鐵人賽 Modern Web DAY 15

技術 實作無障礙網頁功能:真・button —— 按鈕的世界比你想像複雜,別再用 div 刻假按鈕了!

這系列無障礙的鐵人賽文章,實踐的內容主要是根據 W3C:WAI-ARIA 的實踐,從設計模式及組件(Design Patterns and Widgets)裡...

鐵人賽 Modern Web DAY 29

技術 Day29:小事之 jQuery 寫法與 jQuery plugin

前一篇講了所有的選擇器,今天來說明一下 jQuery 基本的寫法,與幾個好用的 plugin。 寫法 $('CSS Selector').要做的事(); 例...

鐵人賽 Modern Web DAY 30
新手也能懂的JS30 系列 第 30

技術 JS30-Day30-打地鼠

Day30-課題內容 終於來到 JS30的最後一天,在今天的課題中,我們將要使用一些之前所學的技能,在頁面上做出一個打地鼠的小遊戲。[1]實作連結 進入課題 要...

鐵人賽 自我挑戰組 DAY 22
Typescript 初心者手札 系列 第 22

技術 【Day 22】TypeScript 類別繼承(Class Inheritance) v.s. 實踐(Implements)

在前兩天的文章中都有提到類別繼承(Class Interitance)的概念,使用的是extends關鍵字,今天會再深入探討並加上討論類別實踐(Class Im...