# 認識Html、CSS、Jsvascript、動態網站、靜態網站 --- tags: HTML CSS relate --- ###### tags: `HTML, CSS` > HTML檔案中只包含結構和內容的資訊,CSS檔案中只包含樣式的資訊。 1. HTML 超文本標記語言(英語:HyperText Markup Language,簡稱:HTML)是一種用於建立網頁的標準標記語言。 HTML是一種基礎技術,常與CSS、JavaScript一起被眾多網站用於設計網頁、網頁應用程式以及行動應用程式的使用者介面。網頁瀏覽器可以讀取HTML檔案,並將其彩現成視覺化網頁。 以下是一個經典的Hello World程式的例子: ``` <!DOCTYPE html> <html> <head> <title>This is a title</title> </head> <body> <p>Hello world!</p> </body> </html> ``` 2. CSS 階層式樣式表(英語:Cascading Style Sheets,縮寫:CSS;又稱串樣式列表、級聯樣式表、串接樣式表、層疊樣式表)是一種用來為結構化文件(如HTML文件或XML應用)添加樣式(字型、間距和顏色等)的電腦語言,由W3C定義和維護。 CSS不能單獨使用,必須與HTML或XML一起協同工作,為HTML或XML起裝飾作用。 CSS例子: ``` p{ font-size: 110%; font-family: garamond, sans-serif; } h2{ color: red; background: white; } .highlight{ color: red; background: yellow; font-weight: bold; ``` 3. JavaScript JavaScript(通常縮寫為JS)是一種進階的、直譯的程式語言。JavaScript是一門基於原型、函式先行的語言,是一門多範式的語言,它支援物件導向程式設計,指令式程式設計,以及函式語言程式設計。它提供語法來操控文字、陣列、日期以及正規表示式等,不支援I/O,比如網路、儲存和圖形等,但這些都可以由它的宿主環境提供支援。 JavaScript的基本特點如下: 是一種解釋性程式語言(代碼不進行預編譯)。 主要用來向HTML頁面添加互動行為。 可以直接嵌入HTML頁面,但寫成單獨的js檔案有利於結構和行為的分離。 JavaScript常用來完成以下任務: 嵌入動態文字於HTML頁面 對瀏覽器事件作出回應 讀寫HTML元素 在資料被提交到伺服器之前驗證資料 檢測訪客的瀏覽器資訊 控制cookies,包括建立和修改等 以下是一個簡單的JavaScript Hello World︰ ``` <!DOCTYPE HTML> <html> <head> <title>簡單的JavaScript Hello World</title> <script type="text/javascript"> document.write("Hello, world!"); // 於瀏覽器視窗內直接顯示 alert("Hello, world!"); // 開啟對話視窗顯示 console.log("Hello, world!"); // 於console裡顯示,需要先開啟開發工具控制台 </script> </head> <body>     HTML內容…… </body> </html> ``` 或是在瀏覽器的網址列中使用javascript:,以互動方式表示: `> javascript:alert("Hello world * 靜態網頁 A static web page (sometimes called a flat page or a stationary page) is a web page that is delivered to the user's web browser exactly as stored, in contrast to dynamic web pages which are generated by a web application. Consequently, a static web page displays the same information for all users, from all contexts, subject to modern capabilities of a web server to negotiate content-type or language of the document where such versions are available and the server is configured to do so. * 動態網頁 A **server-side dynamic web page** is a web page whose construction is controlled by an application server processing server-side scripts. In server-side scripting, parameters determine how the assembly of every new web page proceeds, including the setting up of more client-side processing. A **client-side dynamic web page** processes the web page using HTML scripting running in the browser as it loads. JavaScript and other scripting languages determine the way the HTML in the received page is parsed into the Document Object Model, or DOM, that represents the loaded web page. The same client-side techniques can then dynamically update or change the DOM in the same way. Even though a web page can be dynamic on the client-side, it can still be hosted on a static hosting service such as GitHub Pages or Amazon S3 as long as there isn't any server-side code included. ![](https://i.imgur.com/Pil9jlj.png)