Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> CSS

CSS के साथ प्रत्येक पृष्ठभूमि परत का सम्मिश्रण मोड

<घंटा/>

पृष्ठभूमि-मिश्रण-मोड का उपयोग करें संपत्ति सीएसएस के साथ प्रत्येक पृष्ठभूमि परत के सम्मिश्रण मोड को सेट करने के लिए। आप बैकग्राउंड-ब्लेंड-मोड प्रॉपर्टी को लागू करने के लिए निम्न कोड को चलाने की कोशिश कर सकते हैं और मोड को डार्क करने के लिए सेट कर सकते हैं

उदाहरण

<!DOCTYPE html>
<html>
   <head>
      <style>
         #myDIV {
            width: 250px;
            height: 170px;
            background-repeat: no-repeat, repeat;
            background-image:url("https://www.tutorialspoint.com/assets/videotutorials/courses/3d_animation_online_training/380_course_211_image.jpg"),url( https://www.tutorialspoint.com/latest/dc.js.png);
            background-blend-mode: darken;
         }
      </style>
   </head>
   <body>
      <h1>Set Blend Mode</h1>
      <div id = "myDIV"></div>
   </body>
</html>

  1. - सीएसएस के साथ एनिमेटेड पृष्ठभूमि

    चेतन करने के लिए @keyframes का उपयोग करें। CSS के साथ पृष्ठभूमि पर एनीमेशन लागू करने के लिए, आप निम्न कोड को चलाने का प्रयास कर सकते हैं उदाहरण <!DOCTYPE html> <html>    <head>       <style>          div {      

  1. - सीएसएस के साथ पृष्ठभूमि छवि के रूप में एक रैखिक ढाल सेट करें

    रैखिक ढाल () सीएसएस फ़ंक्शन के साथ पृष्ठभूमि छवि के रूप में एक रैखिक ढाल सेट करें। आप CSS में रेखीय-ग्रेडिएंट () फ़ंक्शन को लागू करने के लिए निम्न कोड को चलाने का प्रयास कर सकते हैं उदाहरण <!DOCTYPE html> <html>    <head>       <style>     &

  1. - CSS के साथ पृष्ठभूमि छवि के रूप में एक रेडियल ग्रेडिएंट सेट करें

    रेडियल-ग्रेडिएंट () CSS फ़ंक्शन के साथ, पृष्ठभूमि छवि के रूप में एक रेडियल ग्रेडिएंट सेट करें। आप CSS में रेखीय-ग्रेडिएंट () फ़ंक्शन को लागू करने के लिए निम्न कोड को चलाने का प्रयास कर सकते हैं उदाहरण <!DOCTYPE html> <html>    <head>       <style> &nb