首頁 web前端 html教學 新手學習舊知識(一)HTML語言基礎

新手學習舊知識(一)HTML語言基礎

Dec 26, 2016 pm 03:08 PM
html

一、為什麼要?

  近兩年來,許多公司開發出了圖形化的HTML開發工具,使得網頁的製作變得非常簡單。如微軟公司推出的 Microsoft FrontPage, Adob​​​​e公司推出的 Adob​​​​e Pagemill, Micromedia公司推出的Dreamweaver等編輯工具,都稱為「所見即所得」的工具。這些圖形化的開發工具可以直接處理網頁,而不用書寫費勁的標記。這使得使用者在沒有HTML語言基礎的情況下,可以照樣編寫網頁。這時,寫HTML文件的任務由開發工具替你完成了。 這是網頁圖形編輯工具的最大成功之處,但也是它們最大的缺點。受到圖形編輯工具本身的約束,將產生大量的垃圾程式碼。原因很簡單,我舉一個簡單的例子你就懂了。例如:在網頁設計一個表格,若是每個單元格的寬度和高度讓它根據其中的內容自動確定,HTML只要你告訴它是表格和單元格的排列順序(也就是行列數)就行了,但因為圖形化開發工具無法得知你的這種特殊要求,所以只能取一般要求,把每個單元格的寬度和高度都定義起來,從而增加了許多程式碼。所以一個明智的網頁編寫者應該在掌握圖形編輯工具的基礎上進一步學會HTML語言,從而知道那些是垃圾程式碼,這樣,我們就可以利用圖形化HTML開發工具快速成地做出網頁,又會消除無用的程式碼,從而達到快速製作高品質網頁的目的。

  二、如何用HTML?

  HTML語言,又稱超文本標記語言,是英文Hyper Text Markup Language的縮寫。 HTML語言作為一種識別性的語言,是由一些特定符號和語法組成的,所以理解和掌握都是十分容易的。可以說,HTML語言在所有的電腦程式語言中是最簡單易學的。 組成HTML的文檔都是ASCIlI檔,所以創建HTML文件十分簡單,只需一個普通的字元編輯器即可。如 Wndows中的記事本、寫字板都可以使用。也可以採用專用的 HTML 編輯工具:如 CoffeeHTML、 Homesite、 HTMLedit Pro等工具,它們的特點是能夠自動檢查HTML文件中的語法錯誤並協助改正。由於有了圖形化的HTML開發工具,使得我們更加容易,我們可以先用它製作好網頁,再在它附帶的HTML代碼編輯器在刪除那些無用的代碼,利用它的所見即所得特性,從而使我們很快就能熟煉地掌握HTML。特別是 Micromedia 公司最近發布的Dreamweaver4,可以把原始碼編輯器和網頁編輯器放在同一個視窗中,真是方便極了。

  三、HTML基本概念

  1、標記

  HTML用來描述功能的符號稱為「標記」。如“HTML”、“BODY”、“TABLE”等。標記在使用是必須用方括號“”括起來,而且是成對出現,無斜杠的標記表示該標記的作用開始,有斜杠的標記表示該標記的作用結束。如

表示一個表格的開始,表標一個表格的結束。在HTML中,標記的大小寫用相同,如和都是表示一個表格的開始。


  標記可以包含標記,如:表格中包含表格或其它標記,如下面這樣的HTML代碼結構是正確的:


,如下面這樣的程式碼是錯誤的:新手學習舊知識(一)HTML語言基礎


這是不正確的代碼

  2、特殊字元

  2、特殊字元

  方號參數和由於方號和由於方號那麼在網頁中要顯示方括號和英文引號只能用其它的符號來代替,下面是常見特殊字符所代表的正常字符:

>或>對應字符>"或" ——對應字符"

à——對應字符A

  3、語法

  一個標記,為了明確它的功能,往往用一些屬性參數來描述,對這些屬性參數的規定上就是所謂的語法,例如:段落標記

,它的語法格式是:

  這就說明

標記有兩個屬性參數,即“align”和“class”,其中“align”靠左、靠右或居中。 ,這是我們判斷無用程式碼的主要標準之一,假如在網頁程式碼中有對預設值進行描述設定的語句程式碼,顯然是無用的程式碼。影響效果或影響很少,我們就盡量取預設值,這樣可以不用設置,從而達到減少程式碼的目的。

The specific values ​​of the marker parameters must be added with Spanish quotation marks. For example: to center the paragraph content, the correct writing method is as follows:


Example of centering the paragraph content


The key to learning how to use HTML language well is to flexibly apply markup parameters. Especially the application of default values.

The above is the content for novices to learn old knowledge (1) HTML language basics. For more related content, please pay attention to the PHP Chinese website (www.php.cn)!


本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

HTML 中的表格邊框 HTML 中的表格邊框 Sep 04, 2024 pm 04:49 PM

HTML 表格邊框指南。在這裡,我們以 HTML 中的表格邊框為例,討論定義表格邊框的多種方法。

HTML 中的巢狀表 HTML 中的巢狀表 Sep 04, 2024 pm 04:49 PM

這是 HTML 中巢狀表的指南。這裡我們討論如何在表中建立表格以及對應的範例。

HTML 左邊距 HTML 左邊距 Sep 04, 2024 pm 04:48 PM

HTML 左邊距指南。在這裡,我們討論 HTML margin-left 的簡要概述及其範例及其程式碼實作。

HTML 表格佈局 HTML 表格佈局 Sep 04, 2024 pm 04:54 PM

HTML 表格佈局指南。在這裡,我們詳細討論 HTML 表格佈局的值以及範例和輸出。

HTML 輸入佔位符 HTML 輸入佔位符 Sep 04, 2024 pm 04:54 PM

HTML 輸入佔位符指南。在這裡,我們討論 HTML 輸入佔位符的範例以及程式碼和輸出。

HTML 有序列表 HTML 有序列表 Sep 04, 2024 pm 04:43 PM

HTML 有序列表指南。在這裡我們也分別討論了 HTML 有序列表和類型的介紹以及它們的範例

在 HTML 中移動文字 在 HTML 中移動文字 Sep 04, 2024 pm 04:45 PM

HTML 中的文字移動指南。在這裡我們討論一下marquee標籤如何使用語法和實作範例。

HTML onclick 按鈕 HTML onclick 按鈕 Sep 04, 2024 pm 04:49 PM

HTML onclick 按鈕指南。這裡我們分別討論它們的介紹、工作原理、範例以及各個事件中的onclick事件。

See all articles