西安做網站PHP入門教材學習方法

  • 孫鑫
  • 2016-09-15
  • 248

學習方法

1.上課認真聽講、勤記筆記;

2.多看相關參考書;

3.勤上機練習,這一點要著重指出,有些同學光聽不練,其實編程是熟能生巧的,光上課能聽懂能理解是不夠的,必須要課後進行大量的練習才可以真正學以致用;西安做網站

4.多看教學視頻;

AG娛樂的課程將按照html基礎、CSS樣式表、Javascript、PHP環境配置(包括簡單的apache配置)、PHP基礎知識、MySQL的基本運用,這樣的幾大塊內容逐步的將學員麽帶入PHP的世界。


那AG娛樂就先從最基礎的html部分開始吧

HTML基礎

一、基本標誌

1.<html>...</html>

<html>標誌用於Html文檔的最前邊,用來標識Html文檔的開始。而</html>標誌恰恰相反,它放在Html文檔的最後邊,用來標識Html文檔的結束,兩個標誌必須一塊使用。

2.<head>...</head>

<head>和</head>構成Html文檔的開頭部分,在此標誌對之間可以使用<title></title>、<script></script>等等標誌對,這些標誌對都是描述Html文檔相關信息的標誌對,<head></head>標誌對之間的內容是不會在瀏覽器的框內顯示出來的。兩個標誌必須一塊使用。

3.<body></body>

<body>...</body>是Html文檔的主體部分,在此標誌對之間可包含<p>、</p>、<h1>、</h1>、<br>、<hr>等等眾多的標誌,它們所定義的文本、圖像等將會在瀏覽器的框內顯示出來。兩個標誌必須一塊使用。<body>標誌中還可以有以下屬性:

屬性 用途 示例

<body bgcolor="#rrggbb"> 設置背景顏色。 <body bgcolor="red">紅色背景

<body text="#rrggbb"> 設置文本顏色。 <body text="#0000ff">藍色文本

<body link="#rrggbb"> 設置鏈接顏色。 <body link="blue">鏈接為藍色

<body vlink="#rrggbb"> 設置已使用的鏈接的顏色。 <body vlink="#ff0000">

<body alink="#rrggbb"> 設置正在被擊中的鏈接的顏色。 <body alink="yellow">

說明:以上各個屬性可以結合使用,如<body bgcolor="red" text="#0000ff">。引號內的rrggbb是用六個十六進製數表示的RGB(即紅、綠、藍三色的組合)顏色,如#ff0000對應的是紅色。此外,還可以使用Html語言所給定的常量名來表示顏色:Black、White、Green、Maroon、Olive、Navy、Purple、Gray、Yellow、Lime、Agua、Fuchsia、Silver、Red、Blue和Teal,如<body text="Blue">表示<body></body>標誌對中的文本使用藍色顯示在瀏覽器的框內。

4.<title>...</title>

使用過瀏覽器的人可能都會注意到瀏覽器窗口最上邊藍色部分顯示的文本信息,那些信息一般是網頁的“主題”,要將學員的網頁的主題顯示到瀏覽器的頂部其實很簡單,隻要在<title></title>標誌對之間加入學員要顯示的文本即可。注意:<title></title>標誌對隻能放在<head></head>標誌對之間。

下麵是一個綜合的例子,仔細閱讀,學員便可以了解以上各個標誌對在一個Html文檔中的布局或所使用的位置及其作用。

範例1-1:Html文檔中基本標誌的使用

<html>

<head>

<title>顯示在瀏覽器最上邊藍色條中的文本</title>

</head>

<body bgcolor="red" text="blue">

<p>紅色背景、藍色文本</p>

</body>

</html>

顯示效果如下圖:


二、格式標誌

上一個節中AG娛樂講了Html文檔的基本標誌,但AG娛樂還不知道怎樣在瀏覽器中顯示文本之類的東西,這正是AG娛樂在節二中將要談到的。在學習之前,必須強調一下,AG娛樂這個節中所講的格式標誌統統都是用於<body></body>標誌對之間的。

1.<p>...</p>

<p></p>標誌對是用來創建一個段落,在此標誌對之間加入的文本將按照段落的格式顯示在瀏覽器上。另外,<p>標誌還可以使用align屬性,它用來說明對齊方式,語法是:<p align=""></p>。align可以是Left(左對齊)、Center(居中)和Right(右對齊)三個值中的任何一個。如<p align="Center"></p>表示標誌對中的文本使用居中的對齊方式。

2.<br>

<br>是一個很簡單的標誌,它沒有結束標誌,因為它用來創建一個回車換行。在<br>的使用上還有一定的技巧,如果學員把<br>加在<p></p>標誌對的外邊,將創建一個大的回車換行,即<br>前邊和後邊的文本的行與行之間的距離比較大,若放在<p></p>的裏邊則<br>前邊和後邊的文本的行與行之間的距離將比較小,學員不妨試試看。

3.<blockquote>...</blockquote>

在<blockquote></blockquote>標誌對之間加入的文本將會在瀏覽器中按兩邊縮進的方式顯示出來。

4.<dl>...</dl>, <dt>...</dt>, <dd>...</dd>

<dl>...</dl>用來創建一個普通的列表,<dt>...</dt>用來創建列表中的上層項目,<dd></dd>用來創建列表中最下層項目,<dt>...</dt>和<dd>...</dd>都必須放在<dl>...</dl>標誌對之間。看一下下麵的例子學員就會明白了:

範例1-2:創建一個普通列表

<html>

<head>

<title>一個普通列表</title>

</head>

<body text="blue">

<dl>

  <dt>中國城市</dt>

    <dd>北京 </dd>

    <dd>上海 </dd>

    <dd>廣州 </dd>

  <dt>美國城市</dt>

    <dd>華盛頓 </dd>

    <dd>芝加哥 </dd>

    <dd>紐約 </dd>

</dl>

</body>

</html>

效果如圖:    

5.<ol>...</ol>, <ul>...</ul>, <li>...</li>

<ol>...</ol>標誌對用來創建一個標有數字的列表;<ul>...</ul>標誌對用來創建一個標有圓點的列表;<li>...</li>標誌對隻能在<ol>...</ol>或<ul>...</ul>標誌對之間使用,此標誌對用來創建一個列表項,若<li>...</li>放在<ol>...</ol>之間則每個列表項加上一個數字,若在<ul>...</ul>之間則每個列表項加上一個圓點。請看下邊的例子:

範例1-3:標有數字或圓點的列表

<html>

<head>

<title></title>

</head>

<body text="blue">

<ol>

<p>中國城市 </p>

<li>北京 </li>

<li>上海 </li>

<li>廣州 </li>

</ol>

<ul>

<p>美國城市 </p>

<li>華盛頓 </li>

<li>芝加哥 </li>

<li>紐約 </li>

</ul>

</body>

</html> 

範例1-3效果如圖:


6.<div>...</div> 

<div>...</div>標誌對用來排版大塊Html段落,也用於格式化表,此標誌對的用法與<p>...</p>標誌對非常相似,同樣有align對齊方式屬性。<div>最重要的應用是在後麵講到CSS樣式表時,與CSS進行搭配,用DIV+CSS來布局網頁,這些內容將在CSS部分詳細介紹。

三、文本標誌

上一個節中AG娛樂已經講了如何在瀏覽器中輸出文本,以及文本輸出的格式,這個節中AG娛樂將談一談文本輸出的字體,如斜體、黑體字、下加一劃線等等。在本節的最後給出了一個html代碼中文本標誌的綜合示例,希望學員能認真閱讀。

1.<h1></h1>……<h6></h6>

Html語言提供了一係列對文本中的標題進行操作的標誌對:<h1></h1>……<h6></h6>,即一共有六對標題的標誌對。<h1></h1>是最大的標題,而<h6></h6>則是最小的標題,也即是標誌中 h 後麵的數字越大標題文本就越小。如果學員的Html文檔中需要輸出標題文本的話,便可以根據實際需要選用這六對標誌中的一對。

2.<b>...</b>, <i>...</i>, <u>...</u>

經常使用 WORD 的人對這三對標誌對一定很快就能掌握。<b></b>用來使文本以黑體字的形式輸出;<i></i>用來使文本以斜體字的形式輸出;<u></u>用來使文本以下加一劃線的形式輸出。後邊將會有一個綜合的例子,所以此處就不再作詳細講解了。

3.<tt>...</tt>, <cite>...</cite>, <em>...</em>, <strong>...</strong>

這些標誌對的用法和上邊的一樣,差別隻是在於輸出的文本字體不太一樣而已。<tt>...</tt>用來輸出打字機風格字體的文本;<cite>...</cite>用來輸出引用方式的字體,通常是斜體;<em>...</em>用來輸出需要強調的文本(通常是斜體加黑體);<strong>...</strong>則用來輸出加重文本(通常也是斜體加黑體)。這些標誌對的示例也將在後邊綜合的例子中出現。

4.<font>...</font>

<font>...</font>是一對很有用的標誌對,它可以對輸出文本的字體大小、顏色進行隨意地改變,這些改變主要是通過對它的兩個屬性 size 和 color 的控製來實現的。size屬性用來改變字體的大小,它可以取值:-1、1和+1;而color屬性則用來改變文本的顏色,顏色的取值是AG娛樂在節一中講過的十六進製RGB顏色碼或Html語言給定的顏色常量名。具體用法請看下邊綜合的例子。




範例1-4:文本標誌的綜合示例

<html>

<head>

<title>文本標誌的綜合示例</title>

</head>

<body text="blue">

<h1>最大的標題</h1>

<h3>使用h3的標題</h3>

<h6>最小的標題</h6>

<p><b>黑體字文本</b> </p>

<p><i>斜體字文本</i> </p>

<p><u>下加一劃線文本</u> </p>

<p><tt>打字機風格的文本</tt></p>

<p><cite>引用方式的文本</cite></p>

<p><em>強調的文本</em></p>

<p><strong>加重的文本</strong></p>

<p><font size="+1" color="red">size取值“+1”、color取值“red”時的文本</font></p>西安做網站

</body>

</html>

範例1-4效果如圖:

四、圖像標誌

再簡單樸素的網頁如果隻有文字而沒有圖像的話將失去許多活力,圖像在網頁製作中是非常重要的一個方麵,Html語言也專門提供了<img>標誌來處理圖像的輸出。

1.<img>

<img>標誌並不是真正地把圖像給加入到Html文檔中,而是將標誌對的src屬性賦值,這個值是圖形文件的文件名,當然包括路徑,這個路徑可以是相對路徑,也可以是絕對路徑。實際上就是通過路徑將圖形文件嵌入到學員的文檔中。必須強調一下,src屬性在<img>標誌中是必須賦值的,是標誌中不可缺少的一部分。除此之外,<img>標誌還有alt、align、border、width和height屬性。align是圖像的對齊方式,在前邊的節中已經講了很多了,這裏就不再提了。border屬性是圖像的邊框,可以取大於或者等於0的整數,默認單位是像素。width和Height屬性是圖像的寬和高,默認單位也是象素。alt屬性是當鼠標移動到圖像上時顯示的文本。

下麵AG娛樂來介紹一下相對路徑和絕對路徑。


西安做網站PHP入門教材學習方法——西安做網站-www.xgktgj.com