به کد زیر توجه کنید؛ کد css بنویسید که تگ های div که داخل آنها تگ p وجود دارد را انتخاب کند و رنگ بک گراند آنها را به قرمز تغییر دهد
Front-End
تمرین جدید
<!DOCTYPE html>
<html lang="en">
<head>
<style>
div:has(p) {
background-color: red;}
</style>
</head>
/********************************/
<body>
<div>
<p>hello</p>
</div>
<div>
<b>bold</b>
</div>
<div>
<p>hello</p>
<p>hello</p>
</div>
</body>
</html>
HTML & CSS
تحلیل جواب با AI
Python - پایتون
PHP - پی اچ پی
JavaScript - جاوا اسکریپت
C# - سی شارپ
C & C++ - سی و سی پلاس پلاس
Kotlin - کاتلین
Java - جاوا
DataBase - دیتابیس
Matlab - متلب
Rust - راست
Golang - گولنگ
Bash - بش
<!DOCTYPE html>
<html>
<head>
<style>
div > p {
background-color: red;
}
</style>
</head>
<body>
<div>
<p>hello</p>
</div>
<div>
<b>bold</b>
</div>
<div>
<p>hello</p>
<p>hello</p>
</div>
</body>
</html>
<!DOCTYPE html>
<html dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport"content="width=device.width, initial-scale=1.0">
<title> pسلکت تگ های </title>
</head>
<style>
div:has(p) {
background-color: red;
}
</style>
<body>
<div>
<p>hello</p>
</div>
<div>
<b>bold</b>
</div>
<div>
<p>hello</p>
<p>hello</p>
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>FORM</title>
<link rel="stylesheet" href="project.css" type="text/css">
</head>
<body>
<div>
<p>hello</p>
</div>
<div>
<b>bold</b>
</div>
<div>
<p>hello</p>
<p>hello</p>
</div>
</body>
</html>
<!--css-->
*{
padding: 0px;
margin: 0xp;
font-style: italic;
box-sizing: border-box;
}
div > p{
color: red;
}
div p{
background-color:red;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>انتخاب بر اساس فرزند</title>
<style>
div p{
background-color: red;
color: white;
}
</style>
</head>
<body>
<div>
<p>hello</p>
</div>
<div>
<b>bold</b>
</div>
<div>
<p>hello</p>
<p>hello</p>
</div>
</body>
</html>
<!DOCTYPE html>
<html lang="en";>
<head>
<meta charset="UTF-8">
<meta name="viewport " content="width=device-width,intial-scale=1.0">
<title> box</title>
<style>
div>p{
background-color: red;
}
div{
background-color: aqua;
}
</style>
</head>
<body>
<div >
<p>dfghjk</p>
</div>
<div>
cfghjkl</div>
</body>
</html>
div:has(p) {
background-color: red;
}
برای انتخاب تگ‌های div که داخل آنها تگ p وجود دارد و تغییر رنگ بک‌گراند به قرمز، می‌توانید از کد CSS زیر استفاده کنید:
div:has(p) {
background-color: red;
}
توجه داشته باشید که :has() در همه مرورگرها پشتیبانی نمی‌شود. اگر نیاز به پشتیبانی از مرورگرهای قدیمی‌تر دارید، باید از JavaScript استفاده کنید.
برای استفاده از این بخش باید وارد حساب کاربریت بشی
ورود/ثبت نام