CSS margin প্রপার্টি নির্বাচিত এলিমেন্টের বর্ডারের চারপাশে মার্জিন এলাকা সেট করতে ব্যবহৃত হয়। Margin প্রপার্টি margin-top, margin-right, margin-bottom, এবং margin-left-এর শর্টহ্যান্ড।
সিনট্যাক্স
CSS margin প্রপার্টির সিনট্যাক্স নিচের মতো:
Selector { margin: /*value*/ }
নিচের উদাহরণগুলো CSS margin প্রপার্টি ব্যাখ্যা করে:
উদাহরণ
<!DOCTYPE html> <html> <head> <style> body * { display: flex; float: left; margin: 10px 15px; border: thin solid; text-align: center; width: 40%; border-radius: 5%; box-shadow: 0 0 4px 1px grey; } p { font-family: "Sim Sun", monospace; background-color: lightcyan; } div { font-family: Impact, cursive; background-color: lightgreen; } </style> </head> <body> <p>First demo text</p> <div>A demo line goes like this..</div> </body> </html>
আউটপুট
উপরোক্ত কোডের আউটপুট:
উদাহরণ
<!DOCTYPE html> <html> <head> <style> table, table * { margin: 5% 30%; border: 12px double red; padding: 0.5rem; border-radius: 30px; } td:nth-child(even) { background-color: lightblue; } td:nth-child(odd) { background-color: lightgreen; } </style> </head> <body> <table> <tr> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> </table> </body> </html>
আউটপুট
উপরোক্ত কোডের আউটপুট:
