কম্পিউটার

CSS-এ শর্টহ্যান্ড প্রপার্টির রূপরেখা


আউটলাইন শর্টহ্যান্ড প্রোপার্টি নির্দিষ্ট শৈলী (প্রয়োজনীয়), বেধ এবং উপাদানের সীমানার চারপাশে রঙের একটি রেখা আঁকতে সংজ্ঞায়িত করা যেতে পারে, তবে সীমারেখা বৈশিষ্ট্যের বিপরীতে রূপরেখাটি উপাদানের মাত্রার অংশ নয়।

সিনট্যাক্স

CSS আউটলাইন শর্টহ্যান্ড সম্পত্তির সিনট্যাক্স নিম্নরূপ -

Selector {
   outline: /*value*/
}

উদাহরণ

চলুন আউটলাইন শর্টহ্যান্ড এর একটি উদাহরণ দেখি সম্পত্তি -

<!DOCTYPE html>
<html>
<head>
<title>CSS outline Shorthand</title>
<style>
span {
   margin: 15px;
   padding: 20px;
   border-style: solid;
   border-color: #f28500 #dc3545;
   position: absolute;
   outline: 5px double green;
   border-radius: 50%;
}
#showDiv {
   margin:auto;
   border-style: solid;
   border-color: darkmagenta dodgerblue;
   outline: groove black;
   height: 80px;
   width: 80px;
}
#container {
   width:50%;
   margin:50px auto;
}
</style>
</head>
<body>
<div id="container">
<div id="showDiv"><span></span></div>
</div>
</body>
</html>

আউটপুট

উপরের কোডের আউটপুট −

নিচে দেওয়া হল

CSS-এ শর্টহ্যান্ড প্রপার্টির রূপরেখা

উদাহরণ

চলুন আউটলাইন শর্টহ্যান্ডের আরেকটি উদাহরণ দেখি সম্পত্তি -

<!DOCTYPE html>
<html>
<head>
<title>CSS outline Shorthand</title>
<style>
#container {
   width:50%;
   margin:50px auto;
}
p {
   margin:auto;
   border-style: ridge;
   border-width: 10px;
   border-color: orange;
   outline: 5px dashed yellow;
}
</style>
</head>
<body>
<div id="container">
<p>Coding Ground is loved by millions of programmers around the globe.</p>
</div>
</body>
</html>

আউটপুট

উপরের কোডের আউটপুট −

নিচে দেওয়া হল

CSS-এ শর্টহ্যান্ড প্রপার্টির রূপরেখা


  1. CSS-এ ন্যূনতম-উচ্চতার বৈশিষ্ট্য

  2. CSS-এ ন্যূনতম-প্রস্থ সম্পত্তি

  3. CSS-এ আউটলাইন-প্রস্থ সম্পত্তি

  4. CSS-এ বর্ডার-কালার প্রপার্টি