HTML基礎練習

cup11發表於2024-11-09
HTML

注意：

  1. 全卷滿分140+45分，時間40分鐘。
  2. 全開卷，並允許聯網查詢。
  3. 凡是標註“不定項”的，每個選項均分總分，每錯選或漏選一個均僅扣除該項得分。例如8分4選項題，答案為AD，選ABD得6分，A得6分，AB得4分。
  4. 所有題目均為人工閱卷，不需要特別遵守格式規範，均按照答案酌情給分。

答題紙程式碼：

0 ID SOC-PROGRAMMING-HTML-BASIC-1
0 NAME
0 H 一、概念計算
1 BT/3,3
2 BT/3,8 BT/3,8 BT/3,6
3 BT/3,3 BT/3,3
4 BT/3,3
5 BT/4,10
6 BT/4,5
7 BT/4,5
8 CI/5,A,B,C,D,E
9 CS/5,A,B,C,D
10 CI/12,A,B,C,D,E,F
0 H 二、程式碼除錯
11 MT/6,2
12 MT/6,2
13 MT/8,2
14 MT/18,3
15 MT/12,2
0 H 三、程式碼實現
16 MT/40,10
0 H 四、附加題
17 BT/6,3
18 BT/10,20
19 MT/24,10

一、概念計算（55分）

  1. （3分）“超文字標記語言”的英語縮寫為______。
  2. （9分）請寫出非空元素的語法通式：___(1)___，單個屬性的語法通式：___(2)___，註釋的語法通式：___(3)___。
  3. （6分）img元素表示__(1)__，其中width屬性的單位是___(2)___。
  4. （3分）若要使用語義化標籤表示側邊欄，應該使用的標籤名為：_____。
  5. （4分）用於HTML5的文件型別宣告語句是：_________________。
  6. （4分）要新增一條水平分割線，可以新增HTML程式碼：_____。
  7. （4分）若要實現效果\(\log_2{10}\)，2需要用到格式標籤：______。
  8. （5分，不定項）下列哪些元素能巢狀在<p>元素內：
    • A. <body>
    • B. <div>
    • C. <p>
    • D. <span>
    • E. <b>
  9. （5分，單選）下列哪個程式碼正確使用了<h1>、<h2>元素：
    • A. <h2>文件</h2><h1>安裝</h1><h1>用法</h1>
    • B. <h1>文件</h1><h2>安裝</h2><h2>用法</h2>
    • C. <h1>文件<h2>安裝</h2><h2>用法</h2></h1>
    • D. <h2>文件</h1><h1>安裝</h1><h1>用法</h2>
  10. （12分，不定項）以下哪些一般可以作為<a>元素的href屬性：
    • A. www.baidu.com
    • B. https://www.baidu.com
    • C. localhost:8090/
    • D. Go to Bilibili.
    • E. http://cn.bing.com
    • F. abc://b.c.d

二、程式碼除錯（50分）

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta name="description" content="一個示例網站">
	<title name="標題" />
</head>

<body>
	<p><b>這是一段加粗文字<b></p>
	<div>
	  <p>點選<a href=https://www.baidu.comtarget="blank">此處</a>在新標籤頁中開啟百度</p>
	  <p>在HTML中，使用<p>元素來表示段落。</p>
	</div>
</body>
</html>

針對以上程式碼，解答下列問題。對於每個問題，先簡要闡述其錯誤原因，然後給出解決方案。

  1. （6分）為什麼HTML介面標題不生效？
  2. （6分）明明是中文介面，為什麼有的瀏覽器開啟此網站後仍然會提示：“當前為英語介面，點選翻譯為中文”？
  3. （8分）為什麼加粗文字一直持續到文件最後？
  4. （18分）點選超連結後，為什麼仍然在當前標籤頁開啟，並且開啟的介面異常？
  5. （12分）為什麼使用<p>元素來表示段落中的<p>沒有正常顯示，反而導致異常換行？

三、程式碼實現（40分）

  1. （40分）根據程式碼骨架和需求備註，實現如下效果圖。
    • （8分）整體結構
    • （6分）程式碼風格
    • （12分）格式標籤
    • （8分）超連結與圖片
    • （6分）meta標籤

image

需求備註如下：

  • era對應的連結為https://www.bing.com/dict/search?q=era；必應詞典對應的連結為https://www.bing.com/dict，二者均需在新標籤頁開啟。
  • 圖片網址為https://www.bing.com/sa/simg/favicon-trans-bg-blue-mg.ico，若未載入出需用“必應圖示”四字代替。
  • 用meta標籤標註作者（你）的名字。

<body>部分的程式碼骨架如下：

練習程式碼
2024.11
<p>No matter what the <a>era</a>,
	and no matter how advanced the science and technology is,
	a moral and ethical education will always be our theme.</p>
<p>詞典由<a>必應
	詞典</a>提供支援</p>

四、附加題（40分）

查詢相關文件，完成下列題目

  1. （6分）當在介面上表示快捷鍵Ctrl+C時，最好使用___元素。
  2. （10分）寫出一個HTML元素，使用abbr元素標記內容，懸停時展示全稱：We can use RFID in this case.（RFID：Radio Frequency Identification）。
  3. （24分）自由開發：個人作品集。

相關文章