SGK Tin học 12 Cánh diều Bài 10. Bộ chọn lớp, bộ chọn định danh có đáp án
6 câu hỏi
Cóthểsửdụngbộchọnđịnhdanh (ID selector) đểápdụngquytắcđịnhdạngchomộtphầntửđãđượcđịnhdanhtrongvănbản HTML. Khi đó, bộchọnđịnhdanhđượcxácđịnhthông qua Tên_địnhdanhcủaphầntửnàyvàđượckhaibáonhưsau:
Khai báobộchọnlớp, bộchọnđịnhdanh, giátrịthuộctính class chophầntử body, id đểhoànthiện website cánhânđãcó ở cácbàihọctrước.
Gợi ý thựchiện.
– Mởtệp “style.css”: Khai báobộchọnlớpcótênbgđểthiếtlậpmàunền (vídụ: lighigrey). Khai báobộchọnđịnhdanhcótên submit đểtrìnhbàymàucủanút
lệnh (vídụ: blue).
- Bổ sung khaibáogiátrịthuộctính class chophầntử body củacáctệp “hobbies.html” và “album.html” là bg.
- Bổ sung khaibáogiátrịthuộctính id chonútlệnh submit trongtệp "index.html" là submit.
Gợi ý thựchiện.
– Mởtệp “style.css”: Khai báobộchọnlớpcótênbgđểthiếtlậpmàunền (vídụ: lighigrey). Khai báobộchọnđịnhdanhcótên submit đểtrìnhbàymàucủanút
lệnh (vídụ: blue).
- Bổ sung khaibáogiátrịthuộctính class chophầntử body củacáctệp “hobbies.html” và “album.html” là bg.
- Bổ sung khaibáogiátrịthuộctính id chonútlệnh submit trongtệp "index.html" là submit.
Code nhưsau:
<!DOCTYPE html>
<html>
<head>
<title>index</title>
<meta charset="utf-8">
</head>
<style>
#tieu_de_muc-chinh {color: red;}
body {background-color: cyan}
p{ -webkit-tap-highlight-color: transparent; margin: 0px; padding: 0px; user-select: text;" data-ccp-parastyle="Normal (Web)">";}
p{}
P{color:red;}
</style>
<body>
<ol>
<h1 id="tieu_de_muc-chinh"> Kếhoạchhọctập </h1>
<p class="blue"> Giớithiệuvềbảnthân </p>
<p class="blue"> Họtêntôilà: ...... Sinh ngày: 25/04/1985. Địachỉ: Hà Nội </p>
</ol>
</body>
</html>
Kếtquảnhưsau:
Code nhưsau:
<!DOCTYPE html>
<html>
<head>
<title>index</title>
<meta charset="utf-8">
</head>
<style>
#tieu_de_muc-chinh {color: red;}
body {background-color: cyan}
p{ -webkit-tap-highlight-color: transparent; margin: 0px; padding: 0px; user-select: text;">";}
p{}
P{color:red;}
</style>
<body>
<ol>
<h1 id="tieu_de_muc-chinh"> Kếhoạchhọctập</h1>
<p class="blue"> Giớithiệuvềbảnthân </p>
<p class="blue"> Họtêntôilà: ...... Sinh ngày: 25/04/1985. Địachỉ: Hà Nội</p>
<p class="blue"> Tôiđanghọclớp 12, Trường................. </p>
</ol>
</body>
</html>
Kếtquả: Hàilòngkhilàmđượcnhữngnội dung web đơngiản.
Cho khaibáođịnhdạng CSS sau:
a.xanh {color: blue; }.
Trong cáckhaibáo HTML sau, khaibáonàosẽápdụngđịnhdạng CSS trên?
A. <p class= "xanh">Học CSS</p>
B.<pid= “xanh”>Học CSS</p>
C. <a href="https://www.w3schools.com" id="xanh">Học CSS</a>
D. <a href="https://www.w3schools.com" class="xanh">Học CSS </a>
Đápánđúnglà:
C. <a href="https://www.w3schools.com" id="xanh">Học CSS</a>
Côgiáoyêucầukhaibáovàápdụng CSS dễđịnhdạngvănbản HTML cónội dung như ở Hình 6a dểcókếtquảhiểnthịtrêntrìnhduyệt web như ở Hình 6b. Sau khitìmhiểu, cácbạnhọcsinhđãđưaracácgiảiphápsauđây. Em hãychobiếtmỗiphátbiểusaulàđúng hay sai:
a) Khai báoCSS sửdụngbộchọnphầntửchophầntử h1 vìnội dung vănbản HTML chỉgồmcácphầntửtiêuđềmục h1.
b) Thựchiệncácbướcsau:
Bước 1. Khai báo CSS sửdụngbộchọnlớpđểđịnhdạngmàuchữkhácvớimàumặcđịnh.
<style>
tieudel {color: red;}
tieude2 {color: blue;}
</style>
Bước 2. Khai báothuộctính class= “tieudel” chocáctiêuđềmụcchữcómàuđỏ, khaibáothuộctính class= “tieude2” chocáctiêuđềmụcchữcómàuxanh.
c) Thựchiệncácbướcsau:
Bước 1. Khai báo CSS sửdụngbộchọnđịnhdanhđểđịnhdạngtiêuđềmụcchữcómàuxanh, cáctiêuđềkhácsửdụngbộchọnphầntử h1.
<style>
#tieudel {color: blue;}
hl {color: red;}
</style>
Bước 2. Khai báothuộctính class = “tieudel” chotiêuđềmụcchữcómàuxanh.
d) Thựchiệncácbướcsau:
Bước 1. Kếthợpkhaibáo CSS sửdụngbộchọnlớp, bộchọnđịnhdanh:
<style>
tieudel {color: red;}
#tieude2 {color: blue;}
</style>
Bước 2. Khai báothuộctính class=“tieudel” chocáctiêuđềmụcchữmàuđỏ, khaibáothuộctính id= “tieude2” chocáctiêuđềmụcchữcómàuxanh.
a) Đúng
b) Sai
c) Sai
d) Đúng
