iT邦幫忙

html5相關文章
共有 291 則文章

技術 在網頁上嵌入Google Map及設置圖釘的方法 (上)

前言最近在開發個人作品,剛好想要實現在網頁中放入Google Map及設置圖釘,所以花了一些時間查詢、研究,發現其實有很多的方法或套件都可以實現這個功能!在這邊...

鐵人賽 SideProject30 DAY 12

技術 Day12. 切版前知識(二) HTML 教學、常用標籤

今天來説說切版時主要用到的技術之一:HTML5。HTML最為人熟知的就是,常用於設計網頁、行動裝置、應用程式等介面設計,網頁瀏覽器能讀取HTML並轉譯成視覺化網...

鐵人賽 影片教學 DAY 7

技術 一起來實作響應式網頁設計:CSS的各種選擇器 Day7

影片教學 重點回顧 昨天的教學影片當中,我們了解如何轉寫CSS來套用到指定的選擇器當中,而昨天我們使用HTML的元素作為選擇器來套用,今天將要介紹其他選擇器,...

鐵人賽 Modern Web DAY 7

技術 #06補充 網頁的根、絕對路徑、相對路徑,那些關於路徑的小知識

HTML 的屬性 href、src 都需要指定檔案路徑才能載入進來,所以這邊補充個關於路徑的小知識。 何謂網頁的根(root)? 指的是網域底下第一層的檔案...

鐵人賽 Modern Web DAY 7

技術 #06 寫一份簡單的 HTML,常用 HTML Tag 總整理

↓ 今日學習重點 ↓ 練習使用 HTML 的各種標籤(tag) 知道 CSS 和 JS 要放在 HTML 的哪裡? 今天,讓我們來了解一份簡單...

鐵人賽 Modern Web DAY 6

技術 #05 HTML 基礎語法

↓ 今日學習重點 ↓ 了解 HTML 的語法 上一篇文章,我們有建立了一份 HTML 檔案, 那麼這些語法到底是什麼意思呢?讓我們往下看。 HTML...

鐵人賽 影片教學 DAY 5

技術 一起來實作響應式網頁設計:HTML的表單元素 Day5

影片教學 重點回顧 平常瀏覽網頁一定會常碰到需要填寫表單的時候,可能是需要註冊某個網站以獲取該網站提供的服務,或是報名活動填寫個人資料,又或者是購買東西需填寫...

鐵人賽 影片教學 DAY 4

技術 一起來實作響應式網頁設計:HTML新增的結構元素 Day4

影片教學 重點回顧 撰寫HTML時,將相關的元素包裝在一起,有助於網頁的結構性,過去式採用div來作為一個區塊,但過多的div可能會造成混淆,因此,透過HTM...

鐵人賽 影片教學 DAY 3

技術 一起來實作響應式網頁設計:HTML的常用元素 Day3

影片教學 重點回顧 今天的內容主要是展示一些常用的元素elements <hr> <!--就是水平線--> <pre>...

鐵人賽 影片教學 DAY 2

技術 一起來實作響應式網頁設計:一探HTML世界 Day2

影片教學 教學重點回顧 HTML全名為HyperText Markup Language,HyperText表示非一般純文字,而是能藉由文字導向到其他網頁。而...

鐵人賽 影片教學 DAY 1

技術 一起來實作響應式網頁設計:HTML的架構 Day1

教學影片 網頁前端三巨頭 說到網頁前端,一定會聽到及碰到這三種語言,分別是:HTML,CSS以及JavaScript,而這三者對於網頁前端的地位簡單比喻可以如...

技術 HTML5:THREE.JS 新手遇到了問題,求幫忙!

</body> <script> var camera, scene, renderer, geometry, materi...

鐵人賽 Modern Web DAY 16
手把手web初學者 系列 第 16

技術 正式進入網頁前的起步走【Semantic elements】

在我們真正要踏入建構網頁之前我們需要先來認識Semantic elements、flexbox 你不可不知的HTML語義標籤Semantic elements...

鐵人賽 Modern Web DAY 7

技術 Bootstrap RWD應用,製作簡易「切換頁面」

製作簡單點選切換互動,搭配Bootstrap就能輕鬆有RWD的效果呦!此範例需引用Bootstrap, fontawesome, jQuery呦。 原頁面比例...

鐵人賽 Modern Web DAY 6

技術 用 HTML, CSS, jQuery來做「動態進度條」

這次的有用到jQuery,讓進度條動起來! HTML 有使用到data-寫法~ <div class="tool-chart" da...

鐵人賽 Modern Web DAY 5

技術 用偽元素改寫input radio,自己設計「單選框」

美化UI小技巧,讓單選框可以更符合設計樣式~ HTML <input type="radio" name="radio&...

鐵人賽 Modern Web DAY 4

技術 如何用HTML與CSS製作出「toggle開關鍵」

iphone常用的開關鍵,其實很簡單! HTML 使用input的checkbox <input id="toggle" class=...

鐵人賽 Modern Web DAY 3

技術 用HTML與CSS製作出「下拉選單」!

input原本的下拉選單太過擁擠,想製作出好看的下拉選單可以參考這邊呦~ HTML 先製作選單input值,讓input內文字能夠顯示出所選選項。 <di...

鐵人賽 影片教學 DAY 2

技術 Day02【從麻瓜變成前端魔法師】HTML 簡介

HTML(架構):好比房子的鋼筋、水泥、磚頭CSS(樣式):就像房子的裝潢、油漆JavaScript(動態效果):霍爾的移動城堡,跑起來~~ 如何快速生...

鐵人賽 Modern Web DAY 2

技術 HTML DOM、HTML5、HTML Template (2)

什麼是 HTML 底下用三句話來說明什麼是 HTML HTML (HyperText Markup Language) 是一種基礎技術是 “標記” 語言。 H...

鐵人賽 Modern Web DAY 2

技術 HTML裡的meta tag這些你用得到的功能!加強SEO搜尋靠它

上一篇講了語意化能夠增加素搜尋引擎辨識網頁中的區塊,這裡來介紹讓SEO能夠搜尋到你的方法!meta是元資訊(meta data),HTML< head &...

鐵人賽 Modern Web DAY 1

技術 HTML5的語意化標籤,加速搜尋引擎讀懂你的網頁

第一次參加鐵人賽~新手中的新手,一步一腳印的學習筆記就在這邊跟大家分享啦!第一篇文章先來簡單介紹HTML5實用的語意化標籤,HTML屬於標記式語言,用<...

鐵人賽 Modern Web DAY 5
【每天5分鐘】學前端 系列 第 5

技術 正版Day05【每天5分鐘】學前端 | HTML 標籤

哈哈,突然發現昨天的標題應該是 Day04 卻打成 Day05 ,是不是不能改了 (ㆆᴗㆆ) ...今天去看海豹被海洋生物們療癒,文章又要 壓線 發了,希望不要...

鐵人賽 Modern Web DAY 4
【每天5分鐘】學前端 系列 第 4

技術 Day05【每天5分鐘】學前端 | HTML 簡介

今天的內容寫得比較趕,希望語句不會有不通順的地方 (> _<);有的話還請多多包涵,謝謝~~ 介紹本日主題 HTML 之前,先來說說網頁組成的金三角...

技術 筆記:好用HTML5 的表單input元件及屬性

html的form標籤之input小記錄 前言本篇是上課中所提及好用,但是筆者小新手之前未發現的上課筆記。 在html5的中,input增加許多tpye可以使瀏...

技術 第一隻狗勾頁面-猴犬

繼上次我說要先第一個用狗勾頁面我就只先設置了那頁的按鈕,記得當你要對按鈕下指令如asp-controller跟action的時候,要先把前面的herf拿掉這裡是...

技術 使用Vue框架串接TheMealDB API

根據TheMealDB API的List all meal categories可看到有很多餐點分類,不過這次用到那麼多分類,所以等下會在data中定義會用到的...

鐵人賽 Modern Web DAY 27

技術 製作響應式網站-30天學會HTML+CSS,製作精美網站

響應式網頁設計是什麼 響應式網頁設計(Responsive Web Design)簡稱RWD,是開發網頁設計中的一種方法,在不改變網站結構,隨著顯示螢幕的大小調...

鐵人賽 自我挑戰組 DAY 22

技術 Day 22 HTML5 <HTML5 input類型、表單標籤>

HTML5新增的input類型: &lt;!-- 需添加form表單域 --&gt; &lt;form action=&quot;&quot;&gt;...

鐵人賽 自我挑戰組 DAY 21

技術 Day 21 HTML5 <HTML5 多媒體標籤>

多媒體標籤可以很方便的在頁面中嵌入音頻和視頻,而不用去使用flash和其他瀏覽器的插件,多媒體標籤主要分為視頻標籤、音頻標籤 1.視頻標籤 &lt;video&...