কম্পিউটার টিউটোরিয়াল

জাভাস্ক্রিপ্টে সব আউটলাইন প্রপার্টি এক ঘোষণায় সেট করা

আউটলাইন প্রপার্টিগুলো সেট করতে outline প্রপার্টিটি ব্যবহার করুন। এটি আউটলাইন রং, শৈলী এবং অফসেট একসাথে সেট করার অনুমতি দেয়।

উদাহরণ

জাভাস্ক্রিপ্টে সব আউটলাইন প্রপার্টি এক ঘোষণায় সেট করতে নিচের কোডটি চালান:

<!DOCTYPE html> <html>    <head>       <style>          #box {             width: 450px;             background-color: orange;             border: 3px solid red;          }       </style>    </head>    <body>       <p>নিচে ক্লিক করুন আউটলাইন যোগ করতে।</p>       <div id="box">          <p>এটি একটি ডিভ। এটি একটি ডিভ। এটি একটি ডিভ। এটি একটি ডিভ। এটি একটি ডিভ।</p>          <p>এটি একটি ডিভ। এটি একটি ডিভ। এটি একটি ডিভ। এটি একটি ডিভ। এটি একটি ডিভ।</p>          <p>এটি একটি ডিভ। এটি একটি ডিভ। এটি একটি ডিভ। এটি একটি ডিভ। এটি একটি ডিভ।</p>       </div>       <br>       <button type="button" onclick="display()">আউটলাইন সেট করুন</button>       <br>       <script>          function display() {             document.getElementById("box").style.outline = "thick solid #5F5F5F";          }       </script>    </body> </html>

ব্যাখ্যা: outline শর্টহ্যান্ড: outline-width || outline-style || outline-color। আর্ডার গুরুত্বপূর্ণ নয়। outline-offset শর্টহ্যান্ডে নেই, আলাদা সেট করতে হয়। উদাহরণে thick solid #5F5F5F এক লাইনে প্রস্থ, শৈলী, রং সেট করা হয়েছে। এটি বর্ডারের চেয়ে বেশি নমনীয় (কোনো দিকেই আলাদা আলাদা করা যায় না, সব দিক একই)।

  1. জাভাস্ক্রিপ্টে একটি এলিমেন্টের চারদিকের আউটলাইন শৈলী সেট করা

  2. জাভাস্ক্রিপ্টে একটি এলিমেন্টের চারদিকের আউটলাইন প্রস্থ সেট করা

  3. জাভাস্ক্রিপ্টে একটি এলিমেন্টের চারদিকের আউটলাইন রং সেট করা

  4. CSS-এ একসাথে সব মার্জিন প্রোপার্টি সেট করা (margin shorthand)