Search
如果您願意看書自學，接下來我報二張明牌給你：
HTML好書推薦：HTML&CSS：網站設計建置優化之道
CSS推薦：活用XHTML/HTML+CSS並不難：幫你搞定所有的網頁
如果您不想看書也沒關係，請直接google 「痞客邦版型設計」或「痞客邦 CSS教學」會有很多教學資源，您就是邊學邊改即可。
最後我要多囉嗦一下，我能教你的只是提示重點，簡單講就是：師傅引進門，修行在個人。
如果您真的想學，還是要靠您自己看書或google，我沒辦法靠1~2篇文章就讓你變成CSS設計達人，這一點希望您能理解。
【CPR民眾版教學】
（其實只是想告訴大家學CPR很重要）
（拜託不要參考我的影片去學啊）
（動畫版只能粗略畫一下重點）
（但我有附網址給民眾參考啊）
（希望各位學長學姐醫生大老不要電我，但歡迎以下開放討論）
（是有多怕被電?）
有鑒於氣象新聞一直說寒流下探八度之類的，
又有新聞報導有一家人騎機車去山上泡湯，
結果媽媽忘記帶心臟藥，
心臟病發倒地，
但小孩不會CPR，
救護車趕到山區救人都已經回天乏術了啊，
大家互相討論結果，
認為住在偏遠地區的民眾真的有CPR技能，
除了學校要定期考試外，
衛生所也要加強民眾急救教育訓練，
尤其是家裡有心臟病等慢性病的病患，
家人更要有CPR技能，
不然開車趕到醫院，或等救護車飆車趕來根本就過了救人黃金時期啊啊啊啊啊…
參考網址
☆CPR民眾版☆
http://tw-aed.mohw.gov.tw/ShowNews.jsp?NewsID=41
（我畫的圖裡沒有"電"，因為並不是每個地方都有AED）
（但很多新聞有報導成功被一般民眾救回的病患，是在沒有AED的狀況下被壓回來）
（有AED很好啦也很普遍了，我是說沒有AED的話）
☆保庇CPR來源☆
http://m.appledaily.com.tw/realtimenews/article/new/20141102/498836/
☆CPR相關新聞☆
http://m.udn.com/xhtml/ViewFreeArticle?type=news&cate=0&page=1&articleid=4103778&sn=1
http://m.ltn.com.tw/news/life/breakingnews/1182516
http://m.ltn.com.tw/news/society/paper/837482
聯合晚報報導了夢想之家和得勝者文教正在進行中的最新計畫，
透過數位方式將讓偏鄉的弱勢課輔班也能享受到高品質的台北補習班課程。
不只是遠距教學，而且是Live、有互動、有獎勵的。
夢想之家期盼與得勝者文教的合作，
幫助每個缺乏資源的偏鄉課輔機構不只是有愛心作公益，更有全國名師助弱勢孩子一臂之力。
我們更期待台灣的每個鄉村、部落的教會都能成為培育青少年課業、品格、生活與夢想的搖籃。
我們需要您的代禱與支持
請和我們攜手用教育改變台灣的下一代。
http://m.udn.com/xhtml/ViewFreeArticle…
國立陽明大學103年暑期課程 - Dreamweaver網頁設計(1)，由孫在陽老師教授。教學內容約3小時。
在這幾年，網頁技術的蓬勃發展與媒體的日新月異，在網站設計中的實用性（usability）、親和性（accessibility）與SEO（Search engine optimization，搜尋引擎最佳化）等概念漸漸被網站設計者與經營者所接受認同。
本課程從網頁設計的基本認識談起，由文字、影像樣式一直到表格運用與排版，使用XHTML與CSS來完成最有效率且具有效果的網站開發。並以範例式的學習，讓您由淺入深的學會網頁設計的基本的技巧！
教學目標：
使學員了解Dreamweaver CS5基本操作，並從中了解網頁設計的概念。整個課程以設計網頁，架設靜態網頁的基本技能訓練為主。
另外安排資訊安全與智慧財產權的基本認識。
國立陽明大學103年暑期課程-Dreamweaver網頁設計，由孫在陽老師講授。課程內容約3小時。
在這幾年，網頁技術的蓬勃發展與媒體的日新月異，在網站設計中的實用性（usability）、親和性（accessibility）與SEO（Search engine optimization，搜尋引擎最佳化）等概念漸漸被網站設計者與經營者所接受認同。
本課程從網頁設計的基本認識談起，由文字、影像樣式一直到表格運用與排版，使用XHTML與CSS來完成最有效率且具有效果的網站開發。並以範例式的學習，讓您由淺入深的學會網頁設計的基本的技巧！
教學目標：
使學員了解Dreamweaver CS5基本操作，並從中了解網頁設計的概念。整個課程以設計網頁，架設靜態網頁的基本技能訓練為主。
另外安排資訊安全與智慧財產權的基本認識。
Unit 02. 目標; HTML Facelets. h:inputText 的重要屬性; h:commandButton 的重要屬性. User Story; 實作程序; 問題與討論; 進一步閱讀. JSF 教學 ... ... <看更多>
WEBJX收集免费的网站后台管理HTML模板-HTML/Xhtml-网页制作-网页教学网. WEBJX收集免费的网站后台管理HTML模板,免费后端管理HTML模板. 歡迎使用Pinterest. ... <看更多>
xhtml教學 在 [心得] HTML語法初級教學(包含單班計概hw5教學) 的推薦與評價
因為小的寫網頁有一段的時間了，所以就代替強者來完成這項教學了。
這篇主要會涵蓋到單班計概Assignment #5的內容，還有基礎HTML教學和部份W3C規則。
-------------------------------------------------------------------------------
一個符合最新XHTML 1.0協定的網頁至少會有以下的內容：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>This is title.</title>
</head>
<body>
</body>
</html>
至於為什麼是這樣，就像#include <stdio.h> int main(){return 0;}一樣，背起來吧！
而由於這次作業還沒需要這麼嚴格的限制，所以就先打以下這樣就可以了。
<html>
<head>
<title>This is title.</title>
</head>
<body>
</body>
</html>
HTML語法是屬於tagged語言，就是所有的東西都要用前後標籤標起來，後標籤要加上"/"，
而如果是不需要後標籤的br或img的話，則在標籤後加上" /"即可，範例如下。
<p>this is test.</p>
<br />
<p><img src="pic.jpg" /></p>
而且有點像stack(堆疊)的概念，先進後出，後進先出，標籤一定要成對，範例如下。
<font size="20"><p>this is a sentence.</p></font> //這是對的
<p><font size="20">this is a sentence.</p></font> //這是錯的
而在網頁中如果要"顯示"以下字元(<,>,&)需分別使用< > &，範例如下。
<p> I & you</p> //錯
<p> I & you</p> //正確
<a href="https://www.website.com/test.php?a=1&b=2"> //錯
<a href="https://www.website.com/test.php?a=1&b=2"> //正確
-------------------------------------------------------------------------------
以下先解釋一下基本語法使用(p,br,a,img,table)。
<p>主要是作為換行用途，範例如下。
<p>這是第一行</p>
<p>這是第二行</p>
而<br />則是另外一種換行。
這是第一行<br />
這是第二行
<a>則是連結使用，範例如下。
<a href="https://tw.yahoo.com/" target="_blank">Yahoo!奇摩首頁</a>
target中主要是在寫有框架的網頁中使用，指定要用哪個框架開啟連結網頁。
而如果要開新網頁的話，則是使用_blank，若未填target表示使用原來的同一頁面。
<img>則是圖片使用，範例如下。
<img src="test.jpg" alt="測試" />
src中填入圖片檔名(含副檔名)，alt中則填入替代文字，主要是在圖片無法顯示時替代。
<table>則是較複雜的語法之一，以下範例是一個2row*3column的表格。
<table>
<tr>
<td>
A</td>
<td>
B</td>
<td>
C</td>
</tr>
<tr>
<td>
D</td>
<td>
E</td>
<td>
F</td>
</tr>
</table>
最外層先使用table框起來，tr則是開啟一row，td則是一row要開幾個column。
如果你有某格想要用類似word中合併儲存格的功能，則就要使用到colspan或rowspan。
而因為這是作業之一，就不告訴大家了，大家可以自己測試看看，不難。
關於作業有某部份關於style，來解釋一下。
style可以任意加在可使用style的標籤中，如a,table,tr,td,p…等。
若需使用1個以上的style，可用分號分開，範例如下。
<p style="color:#FF0000">這會變紅色的字</p>
<p style="color:#FF0000;font-size:large">這會變紅色而且變大</p>
style語法可以參考這個網頁：https://css.1keydata.com/tw/
常常看到某些網頁要特別手動調整編碼才可正常瀏覽，那是因為原先網頁撰寫者設定錯誤
，不然就是未設定，網頁編碼使用如下(放在head標籤之間)。
<meta http-equiv="Content-Type" content="text/html; charset=big5" />
如果要用utf-8的話
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
到這邊，這次作業應該就結束了。
-------------------------------------------------------------------------------
來提一下容易犯的一些W3C規範錯誤。
而標籤中的所有設定值，都要有值，而且要用雙引號quote起來。
如果不需設定值，則使用 屬性="屬性" 的方式設定。
<frame noresize> //錯的
<frame noresize="noresize"> //正確
<font size=20> //錯
<font size="20"> //正確
在HTML語言中，註解文字是使用以下規則，記住，註解文字中不可包含"-"字元。
<!--這是註解文字-->
<!--這是---錯誤的註解文字-->
而最新的XHTML協定中，標籤需要是小寫的。
<TITLE>This is title.</TITLE> //這是錯的
<title>This is title.</title> //這才是標準寫法
所有圖片一定要含有alt屬性。
<img src="yahoo.jpg"> //錯誤
<img src="test.jpg" alt="測試" /> //正確
大致是如此，而W3C也提供了個線上檢測是否符合W3C規定的網頁，如下：
https://validator.w3.org/
可測測看你寫的網頁究竟正確與否。
基礎HTML教學就大致是這樣，有問題請發問，有錯誤也麻煩更正，謝謝。
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 123.204.92.151
... <看更多>