iT邦幫忙

2024 iThome 鐵人賽

DAY 11
0

這邊演示將滑鼠移到按鈕上時刻可出現許多連結可點選~
https://ithelp.ithome.com.tw/upload/images/20240925/20168357QbPimd5V9A.png

這邊打上了內容即可出現在footer上
https://ithelp.ithome.com.tw/upload/images/20240925/20168357LxsLk26uZ2.png
w3schools可以響應式設計、表單處理、資料庫連接(若需要後端功能)等,可以逐步完成並優化網站。
⬇️
使用 W3Schools 建立網站的簡化流程:

  1. 建立 HTML 架構:撰寫網站的基本頁面結構,包含標題、導覽欄、內容區塊、和頁腳。

    <header><nav><a href="#home">首頁</a></nav></header>
    <section id="home"><h2>首頁</h2><p>內容</p></section>
    <footer><p>版權所有</p></footer>
    
  2. 加入 CSS 美化:使用 CSS 控制佈局與樣式(字體、顏色等)。

    body { font-family: Arial; }
    header { background-color: #333; color: white; }
    
  3. 加入 JavaScript 互動:實現基本的互動功能,如顯示隱藏的訊息。

    <button onclick="show()">顯示訊息</button>
    <script>function show() { alert('訊息!'); }</script>
    
  4. 測試與上傳:確認無誤後將網站上傳到伺服器或 GitHub Pages。

測試第一步驟吧!讓我們三十天後撰寫好一個完整的網站~


上一篇
DAY10 Wait!!!完成一個完整的網站需要什麼?
下一篇
今天來設定HTML吧!
系列文
一個網頁的誕生!教你從基礎到自行完成設計網站30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言