Menu
CoddyTech

复习挑战

本课属于 Coddy HTML 学习旅程的“精通 CSS”单元。第 6 课,共 43 课。

challenge icon

挑战

简单

你已经学会了如何使用后代、子元素、相邻兄弟和通用兄弟组合符组合 CSS 选择器。现在该把所学内容付诸实践了!

  1. 将类为 .rooms 的 <div> 内所有直接子元素 <p> 设置为绿松石蓝(#40e0d0)。
  2. 将类为 .facilities 的 <div> 内所有后代 <p> 设置为海沫绿(#2e8b57)。
  3. 将 <div> 之后的每个 <p> 元素设置为沙米色(#f4a300)。

亲手试试

<!DOCTYPE html>
<html>
<head>
    <title>Recap Challenge</title>
    <style>
        /* Your CSS solution here */
        
    </style>
</head>
<body>
    <section>
  		<h1>Welcome to Paradise Resort</h1>
  
  		<div class="rooms">
    		<h2>Ocean View Rooms</h2>
    		<p>Room 101</p>
    		<p>Room 102</p>
  		</div>

  		<div class="facilities">
    		<h2>Resort Facilities</h2>
    		<div>
      			<p>Infinity Pool</p>
      			<p>Spa & Wellness Center</p>
    		</div>
    		<p>Beach Access</p>
  		</div>

  		<p>Beachfront Restaurant</p>
  		<p>Sunset Bar</p>
  		
	</section>
</body>
</html>

精通 CSS中的所有课

自己练习: Web 在线编辑器