حالت آفلاین — محتوا از حافظهٔ کش نمایش داده می‌شود

انتخاب یک عنصر با class

تمرین آسان 1140 visibility link download flag

کد css بنویسید که همه المان های زیر را یکباره انتخاب کند و رنگ پس زمینه آنها را به زرد تغییر دهد


<div id="box" class="yellow"></div>
<div class="yellow"></div>
<div class="yellow mybox"></div>

reply 14

visibility
<!DOCTYPE html>
<html dir="rtl">
<head>
   <meta charset="UTF-8">
   <meta name="viewport"content="width=device.width, initial-scale=1.0">
  <title> رنگ</title>
  </head>
  <style>
    div{
      background-color: yellow
    }
  </style>
<body>
  <div id="box" class="yellow">رضا</div>
  <div class="yellow">هادی</div>
  <div class="yellow mybox">هوشنگ</div> 
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #box , .yellow , .mybox {
            background-color: yellow;
            width: 100px;
            height: 100px;
            border-radius: 15px;
            margin: 10px;
        }
    </style>
</head>
<body>
    <div id="box" class="yellow"></div>
    <div class="yellow"></div>
    <div class="yellow mybox"></div>
</body>
</html>
<!DOCTYPE html>
<html lang="fa" dir="rtl">
<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>
        .yellow{
            background-color: rgb(247, 247, 100);
            color: black;
            width: 50px;
            height: 50px;
            border-radius: 10px;
            margin: 10px;
            padding: 10px;
            font-size: 18px;
        }
    </style>
</head>
<body>
    <div class="yellow">s</div>
    <div class="yellow">w</div>
    <div class="yellow mybox">r</div>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>CSS train</title>
   <style>
    div.a{
      background-color: rgb(186, 216, 241);
      width: 400px;
      height: 250px;
      border: 2px solid#f31111;
      border-radius: 50px;
      margin: 170px;
      box-sizing: border-box;
      box-shadow: 7px -7px 10px #7d8676;
    }
     div.yellow{

      background-color: rgba(255, 255, 0, 0.771);
      width: 300px;
      height: 30px;
      border: 2px solid#f31111;
      border-radius: 50px;
      font-size: 2.5vw;
      font-weight: 900;
      padding: 10px;
      margin: 10px;
      margin-left: 30px;
      margin-top: 20px;
      text-align: center;
      text-shadow: 7px 5px 5px #f31111;

     }
   </style>

</head>
  <body style="background-color: lightgray;">
      <div class="a">
            <div id="box" class="yellow">باکس اول</div>
          <div class="yellow">باکس دوم</div>
          <div class="yellow">باکس سوم</div>
      </div>

  </body>
</html>
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>MOHAMMAD ALI MESBAH</title>
  <style>
    .yellow{
      background-color: yellow;
      width: 100px;
      height: 100px;
    }
  </style>
</head>
<body>
  <br>
  <div id="box" class="yellow"></div> <br>
  <div class="yellow"></div> <br>
  <div class="yellow"></div>
</body>
</html>
<!doctype html>
<html lang="fa-IR" dir="rtl">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>انتخاب یک عنصر با Class</title>
    <style>

      * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
      }

      body {
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #f6f6f6;
      }

      .yellow {
        width: 250px;
        height: 250px;
        background-color: yellow;
        margin: 10px;
        border: 2px solid orange;
        border-radius: 10px;
      }
    </style>
  </head>
  <body>
    <div id="box" class="yellow"></div>
    <div class="yellow"></div>
    <div class="yellow mybox"></div>
  </body>
</html>

<< صفحه قبل 1 2 صفحه بعد >>

ارسال جواب

جوابت را با Markdown بنویس و ثبت کن

×
بستن