網頁設計師職位應聘面試的常見試題及參考答案
編輯：前端技巧
1. ASP.NET Web應用程序的模板有哪些?它們之間的區別是什麼?
【解答】
模板有：ASP.NET網站、ASP.NET Web服務、個人網站初學者工具包、空網站四類。
ASP.NET網站_即通常說的Web 應用程序，它包括有文件系統站點、本地IIS站點、FTP站點和遠程站點四類。通過第11章的圖11-1中的“位置”來選擇不同的站點類型。
ASP.NET Web服務_是一個服務器端提供的服務，該服務器端提供了一些方法，這些方法可以在Internet上被其他客戶在任何操作平台上直接調用，而且不需要考慮這些方法是用哪種語言寫的。
個人網站初學者工具包_是一個已經創建好了的個人網站，其中包括主頁、摘要和相冊等。可以在此基礎上添加自己的內容或者是頁面。
空網站_創建時僅僅建立一個空白的項目，不包含任何文件或頁面。可以向其中添加所需要的各種資源文件。
2. 什麼是同步網站?上機完成例11-2，體會其含義。
【解答】
在本地網站和遠程網站間通過復制網站工具復制每一個文件的最新版本，以致兩個網站擁有所有文件的同一副本，這樣的過程就是同步網站。
3. HTML的含義是什麼?其主體部分由什麼標記構成?
【解答】
HTML即Hyper Text Markup Language超文本標記語言，是構成網頁最基本的元素。標記和之間的內容構成了HTML的主體部分，網頁中的所有內容，包括文字、圖形、鏈接以及其他頁面元素都包含在該標記符內。
4. 標記br和p有什麼區別?
【解答】
標記br和p都可以用來換行，但是二者是有區別的。<br>標記使當前行強行中斷而另起一行，但是新行與原來的行保持相同的屬性，即新行與原來的行屬於同一段落，而<p>標記在換行的時候另起了一新的段落；<br>標記無對應的結束標記</br>，而<p>標記必須和</p>配合使用，不能省略</p>。
5. URL指的是什麼?有何作用?分為幾種?有什麼區別?
【解答】
URL是統一資源定位符，用於定位Web上的文件信息。
URL有絕對和相對之分。絕對URL就是指完整的資源地址，具體形式為：協議名稱://計算機域名/路徑和文件名。一般情況下，在指定外部Internet資源時應使用絕對URL。相對URL指資源相對於當前頁面的路徑。使用相對URL時，一般使用點“.”和雙點“..”表示當前目錄和上一級目錄(父目錄)。在制作網站的時候，只要站點各資源的相對位置不變，就使用相對URL.
6. 試畫出代碼如下的表格。
【解答】
第6題 得到的表格
7 說明在網頁設計中層的作用。
【解答】
層，也就是DIV標記，是一個區塊級的HTML標記，在該標記之間可以添加段落、表格、圖片等內容，使同一個DIV標記中的元素具有相同的樣式，並可在頁面顯示時同時出現、移動以及隱藏。
它的主要作用有以下兩點：(1) 將一些標記元素組織起來，應用DIV的屬性為這些標記元素定義統一的樣式;(2) 利用其z-index屬性，實現頁面內各元素的重疊顯示效果;(3) 使頁面上顯示更多的特效功能。
8. 母版頁的作用是什麼?
【解答】
母版頁(Master Page)的擴展名為“.master”，它相當於網頁的模板。在其他網頁中，只要引用了母版頁，母版頁的頁面就可以自動顯示出來，設計者可以修改引用的母版頁中預留的部分，其它部分保持不變，這樣就可以使多個頁面的風格保持一致，給網頁設計帶來了很大的方便。
9. CSS指的是什麼?在網頁制作中為什麼要使用CSS技術?
【解答】
CSS(Cascading Style Sheets)也叫層疊樣式表，它是用來控制網頁中一個或多個元素的外觀。在網頁制作中，使用樣式表可以減少很多具有相同外觀元素的重復設置工作，從而給網頁的設計和維護帶來了很大的方便;具體應用是：改變樣式表中元素顯示樣式的定義，則在使用該樣式表的所有網頁中相應元素的顯示樣式都會自動發生改變。
10. 網頁制作中有哪幾種樣式設置方法?各有何特點?
【解答】
網頁制作中有：內聯式樣式設置、直接嵌入式樣式設置和外部鏈接式樣式設置三種方式。
1) 內聯式樣式設置：
設置方法：直接在要設置樣式的各標記元素中修改style屬性;
優點：直觀、方便;
缺點：不易於維護和修改;
適用於：網頁中個別需要修改的元素的樣式定義;
2) 直接嵌入式樣式設置：
設置方法：在HTML文檔的<head></head>之間添加<style></style>定義，<style></style> 部分是所有需要設置樣式的元素的屬性定義。
優點：對當前頁面內的所有元素的樣式修改、維護比較方便;
缺點：對於網站建設，要采用相同的樣式設置則比較麻煩;
適用於：單獨網頁的樣式定義;
3) 外部鏈接式樣式設置：
設置方法：把所有樣式定義放在一個獨立的文件中，凡是需要使用該文件中規定樣式的網頁，只要在其<head>與</head>之間添加一個對該樣式文件的鏈接：<link type="text/css" href="MyStyle1.css" rel="Stylesheet" /> 即可;
適用於：需要統一顯示樣式的網站建設。
11. 用戶自定義的類和ID在定義和使用時有什麼區別?
【解答】
定義時，類以英文形式的句點“.”為起始標志，ID以“#”為起始標志;使用時，類可以在一個頁面中被多個不同的元素引用，而ID在一個頁面中只能被引用一次。
12. 樣式定義如下，試說明顯示結果，並做相應解釋。
樣式表文件StyleExercise.css：
以下是引用片段：
復制代碼代碼如下:
body
{
background-color:#ccccff;
}
p
{
color:Blue;
font-size:30px;
}
h1
{
color:Yellow;
font-size:medium;
}
p a
{
color :Orange;
font-size:40px;
}
HTML文件：
以下是引用片段：
復制代碼代碼如下:
<head>
<title>樣式作業練習</title>
<link type="text/css" rel=Stylesheet href=StyleExercise.css />
<style>
h1{color:red;}
.first{background-color:black;}
</style>
</head>
<body>
<h1 style="color:brown;">標題1</h1>
<h1 class=first>標題2</h1>
<p style="font-size:20px;">文本</p>
<p>這是一個<a href=<a href="http://www.jb51.net">http://www.jb51.net</a>>鏈接</a>演示。</p>
<a href=<a href="http://www.jb51.net">http://www.jb51.net</a>>另一個鏈接</a>
</body>
1) 第一次使用的P、H1~H6標記均以紅色的“40px”大小的字體顯示;
2) 超鏈接未選中時，以藍色字體顯示;當鼠標移動到上方時，以原字體大小的1.5倍的橙色字體顯示;當超鏈接被點擊之後，以暗紅色字體顯示;
3) 所有P標記的內容都以列表的形式顯示;
4) 所插入圖片的左右兩側都允許有文字出現;
5) 使用背景圖片，並使其在整個頁面的兩個方向平鋪。
【解答】
該HTML頁面與樣式表文件建立了鏈接，顯示時以“#ccccff”色為背景色;
“標題1”：三種樣式定義方式都使用了，最終按照就近原則，以內聯式樣式定義的顏色“brown”、外部鏈接的樣式表文件定義的字體大小“medium”顯示;
“標題2”：使用了外部鏈接和直接嵌入的樣式定義，以直接嵌入式定義的顏色“red”、類.first定義的背景色“black”、 外部鏈接的樣式定義的字體大小“medium”顯示;
“文本”：使用了外部鏈接和內聯式的樣式定義，以內聯式定義的字體大小“20px”、外部鏈接的樣式定義的顏色“blue”顯示;
“這是一個……演示”：使用了外部鏈接的樣式定義，以顏色“blue”、 字體大小“30px”顯示;其中“鏈接”二字，使用了包含選擇符的樣式定義，以樣式表定義的顏色“orange”、字體大小“40px”顯示;
“另一個鏈接”：沒有樣式定義，按默認方式顯示。
1) 第一次使用的P、H1~H6標記均以紅色的“40px”大小的字體顯示;
2) 超鏈接未選中時，以藍色字體顯示;當鼠標移動到上方時，以原字體大小的1.5倍的橙色字體顯示;當超鏈接被點擊之後，以暗紅色字體顯示;
3) 所有P標記的內容都以列表的形式顯示;
4) 所插入圖片的左右兩側都允許有文字出現;
5) 使用背景圖片，並使其在整個頁面的兩個方向平鋪。
13. 什麼是腳本語言?目前流行的有哪些腳本語言?主要區別是什麼?
【解答】
腳本語言是一種介於HTML語言和C++、Visual Basic等程序設計語言之間的語言，它在形式和功能上可能更接近後者，但它並不是應用程序開發語言，所以語法規則沒有那麼嚴格和復雜，也無需編譯。目前流行的浏覽器腳本語言主要有：ECMAScript、Jscript、JavaScript、VBScript等。
VBScript是Visual Basic的子集，是特意為在浏覽器中進行工作而設計的，它不包括一些在腳本這個范圍以外的特性，如文件訪問和打印等等。它是基於Microsoft的Visual Basic語言。目前只有Microsoft Internet Explore版本3或更高的版本支持VBScript，Netscape的浏覽器並不支持VBScript。
JScript從一組編程語言如C, C++以及Java等之中脫離出來的，是Microsoft公司在其Internet Explore 3.0浏覽器中開始實現的解釋性腳本語言。Jscript來源於Netscape公司出版的JavaScript文檔，但是並不具有JavaScript的全部特性。
JavaScript是基於SUN公司的JAVA語言，用於創建動態的聯機應用程序，這些程序能夠將客戶端和服務器端的對象和資源連接在一起。Microsoft Internet Explore和Netscape Navigator均支持JavaScript。
14. 設計一個ASP.NET Web應用程序，要求從下向上滾動顯示一行信息。
【解答】
1) 建立一個新的Web應用程序，在Default.aspx頁面的【源】視圖中加入<MARQUEE></MARQUEE>。
2) 切換到【設計】視圖，調整控件大小和位置，然後在控件中輸入顯示內容，例如“歡迎參加MARQUEE控件練習”。
3) 修改該控件的【behavior】屬性為【scroll】。
4) 修改該控件的【direction】屬性為【up】。
15. 查找資料，學習掌握如何使用背景音樂、模式對話框和非模式對話框?模式對話框和非模式對話框的區別是什麼?
【解答】
可以用bgsound播放背景音樂，例如
模式對話框的格式為：
window.showModalDialog(sURL[,vArguments][,sFeatures])
用來創建一個展示指定HTML文檔的模式對話框。sURL是字符串，用來指定HTML文檔;vArguments指定展示文檔時使用的參數;sFeatures用來指定窗體的參數值。例如：
以下是引用片段：
復制代碼代碼如下:
<script>window.showModalDialog('test1.htm','Dialog Arguments Value',
'dialogHeight: 341px; dialogWidth: 656px; dialogTop: 86px; dialogLeft: 100px; edge: Raised;
center: Yes; help: Yes; resizable: Yes; status: Yes;');</script>
非模式對話框的格式為：
window.showModelessDialog(sURL[,vArguments][,sFeatures])
參數含義同模式對話框。例如：
以下是引用片段：
復制代碼代碼如下:
<script>window.showModelssDialog('test1.htm','Dialog Arguments Value',
'dialogHeight: 341px; dialogWidth: 656px; dialogTop: 86px; dialogLeft: 100px; edge: Raised;
center: Yes; help: Yes; resizable: Yes; status: Yes;');</script>
【解答】
模板有：ASP.NET網站、ASP.NET Web服務、個人網站初學者工具包、空網站四類。
ASP.NET網站_即通常說的Web 應用程序，它包括有文件系統站點、本地IIS站點、FTP站點和遠程站點四類。通過第11章的圖11-1中的“位置”來選擇不同的站點類型。
ASP.NET Web服務_是一個服務器端提供的服務，該服務器端提供了一些方法，這些方法可以在Internet上被其他客戶在任何操作平台上直接調用，而且不需要考慮這些方法是用哪種語言寫的。
個人網站初學者工具包_是一個已經創建好了的個人網站，其中包括主頁、摘要和相冊等。可以在此基礎上添加自己的內容或者是頁面。
空網站_創建時僅僅建立一個空白的項目，不包含任何文件或頁面。可以向其中添加所需要的各種資源文件。
2. 什麼是同步網站?上機完成例11-2，體會其含義。
【解答】
在本地網站和遠程網站間通過復制網站工具復制每一個文件的最新版本，以致兩個網站擁有所有文件的同一副本，這樣的過程就是同步網站。
3. HTML的含義是什麼?其主體部分由什麼標記構成?
【解答】
HTML即Hyper Text Markup Language超文本標記語言，是構成網頁最基本的元素。標記和之間的內容構成了HTML的主體部分，網頁中的所有內容，包括文字、圖形、鏈接以及其他頁面元素都包含在該標記符內。
4. 標記br和p有什麼區別?
【解答】
標記br和p都可以用來換行，但是二者是有區別的。<br>標記使當前行強行中斷而另起一行，但是新行與原來的行保持相同的屬性，即新行與原來的行屬於同一段落，而<p>標記在換行的時候另起了一新的段落；<br>標記無對應的結束標記</br>，而<p>標記必須和</p>配合使用，不能省略</p>。
5. URL指的是什麼?有何作用?分為幾種?有什麼區別?
【解答】
URL是統一資源定位符，用於定位Web上的文件信息。
URL有絕對和相對之分。絕對URL就是指完整的資源地址，具體形式為：協議名稱://計算機域名/路徑和文件名。一般情況下，在指定外部Internet資源時應使用絕對URL。相對URL指資源相對於當前頁面的路徑。使用相對URL時，一般使用點“.”和雙點“..”表示當前目錄和上一級目錄(父目錄)。在制作網站的時候，只要站點各資源的相對位置不變，就使用相對URL.
6. 試畫出代碼如下的表格。
【解答】
第6題 得到的表格
7 說明在網頁設計中層的作用。
【解答】
層，也就是DIV標記，是一個區塊級的HTML標記，在該標記之間可以添加段落、表格、圖片等內容，使同一個DIV標記中的元素具有相同的樣式，並可在頁面顯示時同時出現、移動以及隱藏。
它的主要作用有以下兩點：(1) 將一些標記元素組織起來，應用DIV的屬性為這些標記元素定義統一的樣式;(2) 利用其z-index屬性，實現頁面內各元素的重疊顯示效果;(3) 使頁面上顯示更多的特效功能。
8. 母版頁的作用是什麼?
【解答】
母版頁(Master Page)的擴展名為“.master”，它相當於網頁的模板。在其他網頁中，只要引用了母版頁，母版頁的頁面就可以自動顯示出來，設計者可以修改引用的母版頁中預留的部分，其它部分保持不變，這樣就可以使多個頁面的風格保持一致，給網頁設計帶來了很大的方便。
9. CSS指的是什麼?在網頁制作中為什麼要使用CSS技術?
【解答】
CSS(Cascading Style Sheets)也叫層疊樣式表，它是用來控制網頁中一個或多個元素的外觀。在網頁制作中，使用樣式表可以減少很多具有相同外觀元素的重復設置工作，從而給網頁的設計和維護帶來了很大的方便;具體應用是：改變樣式表中元素顯示樣式的定義，則在使用該樣式表的所有網頁中相應元素的顯示樣式都會自動發生改變。
10. 網頁制作中有哪幾種樣式設置方法?各有何特點?
【解答】
網頁制作中有：內聯式樣式設置、直接嵌入式樣式設置和外部鏈接式樣式設置三種方式。
1) 內聯式樣式設置：
設置方法：直接在要設置樣式的各標記元素中修改style屬性;
優點：直觀、方便;
缺點：不易於維護和修改;
適用於：網頁中個別需要修改的元素的樣式定義;
2) 直接嵌入式樣式設置：
設置方法：在HTML文檔的<head></head>之間添加<style></style>定義，<style></style> 部分是所有需要設置樣式的元素的屬性定義。
優點：對當前頁面內的所有元素的樣式修改、維護比較方便;
缺點：對於網站建設，要采用相同的樣式設置則比較麻煩;
適用於：單獨網頁的樣式定義;
3) 外部鏈接式樣式設置：
設置方法：把所有樣式定義放在一個獨立的文件中，凡是需要使用該文件中規定樣式的網頁，只要在其<head>與</head>之間添加一個對該樣式文件的鏈接：<link type="text/css" href="MyStyle1.css" rel="Stylesheet" /> 即可;
適用於：需要統一顯示樣式的網站建設。
11. 用戶自定義的類和ID在定義和使用時有什麼區別?
【解答】
定義時，類以英文形式的句點“.”為起始標志，ID以“#”為起始標志;使用時，類可以在一個頁面中被多個不同的元素引用，而ID在一個頁面中只能被引用一次。
12. 樣式定義如下，試說明顯示結果，並做相應解釋。
樣式表文件StyleExercise.css：
以下是引用片段：
復制代碼代碼如下:
body
{
background-color:#ccccff;
}
p
{
color:Blue;
font-size:30px;
}
h1
{
color:Yellow;
font-size:medium;
}
p a
{
color :Orange;
font-size:40px;
}
HTML文件：
以下是引用片段：
復制代碼代碼如下:
<head>
<title>樣式作業練習</title>
<link type="text/css" rel=Stylesheet href=StyleExercise.css />
<style>
h1{color:red;}
.first{background-color:black;}
</style>
</head>
<body>
<h1 style="color:brown;">標題1</h1>
<h1 class=first>標題2</h1>
<p style="font-size:20px;">文本</p>
<p>這是一個<a href=<a href="http://www.jb51.net">http://www.jb51.net</a>>鏈接</a>演示。</p>
<a href=<a href="http://www.jb51.net">http://www.jb51.net</a>>另一個鏈接</a>
</body>
1) 第一次使用的P、H1~H6標記均以紅色的“40px”大小的字體顯示;
2) 超鏈接未選中時，以藍色字體顯示;當鼠標移動到上方時，以原字體大小的1.5倍的橙色字體顯示;當超鏈接被點擊之後，以暗紅色字體顯示;
3) 所有P標記的內容都以列表的形式顯示;
4) 所插入圖片的左右兩側都允許有文字出現;
5) 使用背景圖片，並使其在整個頁面的兩個方向平鋪。
【解答】
該HTML頁面與樣式表文件建立了鏈接，顯示時以“#ccccff”色為背景色;
“標題1”：三種樣式定義方式都使用了，最終按照就近原則，以內聯式樣式定義的顏色“brown”、外部鏈接的樣式表文件定義的字體大小“medium”顯示;
“標題2”：使用了外部鏈接和直接嵌入的樣式定義，以直接嵌入式定義的顏色“red”、類.first定義的背景色“black”、 外部鏈接的樣式定義的字體大小“medium”顯示;
“文本”：使用了外部鏈接和內聯式的樣式定義，以內聯式定義的字體大小“20px”、外部鏈接的樣式定義的顏色“blue”顯示;
“這是一個……演示”：使用了外部鏈接的樣式定義，以顏色“blue”、 字體大小“30px”顯示;其中“鏈接”二字，使用了包含選擇符的樣式定義，以樣式表定義的顏色“orange”、字體大小“40px”顯示;
“另一個鏈接”：沒有樣式定義，按默認方式顯示。
1) 第一次使用的P、H1~H6標記均以紅色的“40px”大小的字體顯示;
2) 超鏈接未選中時，以藍色字體顯示;當鼠標移動到上方時，以原字體大小的1.5倍的橙色字體顯示;當超鏈接被點擊之後，以暗紅色字體顯示;
3) 所有P標記的內容都以列表的形式顯示;
4) 所插入圖片的左右兩側都允許有文字出現;
5) 使用背景圖片，並使其在整個頁面的兩個方向平鋪。
13. 什麼是腳本語言?目前流行的有哪些腳本語言?主要區別是什麼?
【解答】
腳本語言是一種介於HTML語言和C++、Visual Basic等程序設計語言之間的語言，它在形式和功能上可能更接近後者，但它並不是應用程序開發語言，所以語法規則沒有那麼嚴格和復雜，也無需編譯。目前流行的浏覽器腳本語言主要有：ECMAScript、Jscript、JavaScript、VBScript等。
VBScript是Visual Basic的子集，是特意為在浏覽器中進行工作而設計的，它不包括一些在腳本這個范圍以外的特性，如文件訪問和打印等等。它是基於Microsoft的Visual Basic語言。目前只有Microsoft Internet Explore版本3或更高的版本支持VBScript，Netscape的浏覽器並不支持VBScript。
JScript從一組編程語言如C, C++以及Java等之中脫離出來的，是Microsoft公司在其Internet Explore 3.0浏覽器中開始實現的解釋性腳本語言。Jscript來源於Netscape公司出版的JavaScript文檔，但是並不具有JavaScript的全部特性。
JavaScript是基於SUN公司的JAVA語言，用於創建動態的聯機應用程序，這些程序能夠將客戶端和服務器端的對象和資源連接在一起。Microsoft Internet Explore和Netscape Navigator均支持JavaScript。
14. 設計一個ASP.NET Web應用程序，要求從下向上滾動顯示一行信息。
【解答】
1) 建立一個新的Web應用程序，在Default.aspx頁面的【源】視圖中加入<MARQUEE></MARQUEE>。
2) 切換到【設計】視圖，調整控件大小和位置，然後在控件中輸入顯示內容，例如“歡迎參加MARQUEE控件練習”。
3) 修改該控件的【behavior】屬性為【scroll】。
4) 修改該控件的【direction】屬性為【up】。
15. 查找資料，學習掌握如何使用背景音樂、模式對話框和非模式對話框?模式對話框和非模式對話框的區別是什麼?
【解答】
可以用bgsound播放背景音樂，例如
模式對話框的格式為：
window.showModalDialog(sURL[,vArguments][,sFeatures])
用來創建一個展示指定HTML文檔的模式對話框。sURL是字符串，用來指定HTML文檔;vArguments指定展示文檔時使用的參數;sFeatures用來指定窗體的參數值。例如：
以下是引用片段：
復制代碼代碼如下:
<script>window.showModalDialog('test1.htm','Dialog Arguments Value',
'dialogHeight: 341px; dialogWidth: 656px; dialogTop: 86px; dialogLeft: 100px; edge: Raised;
center: Yes; help: Yes; resizable: Yes; status: Yes;');</script>
非模式對話框的格式為：
window.showModelessDialog(sURL[,vArguments][,sFeatures])
參數含義同模式對話框。例如：
以下是引用片段：
復制代碼代碼如下:
<script>window.showModelssDialog('test1.htm','Dialog Arguments Value',
'dialogHeight: 341px; dialogWidth: 656px; dialogTop: 86px; dialogLeft: 100px; edge: Raised;
center: Yes; help: Yes; resizable: Yes; status: Yes;');</script>
- 上一頁:網頁頁腳該注意的地方小結
- 下一頁:設計一個有趣的網站的方法與技巧(圖)
小編推薦
熱門推薦