আমরা অন্য CSS ঘোষণার মধ্যে অতিরিক্ত CSS ফাইল আমদানি করতে পারি। @import নিয়মটি এই উদ্দেশ্যে ব্যবহার করা হয় কারণ এটি একটি নথিতে একটি স্টাইলশীট লিঙ্ক করে। এটি সাধারণত ব্যবহৃত হয় যখন একটি স্টাইলশীট অন্যটির উপর নির্ভরশীল হয়। এটি
এর ভিতরে @charset ঘোষণার পরে নথির শীর্ষে নির্দিষ্ট করা হয়েছে।সিনট্যাক্স
@import নিয়মের সিনট্যাক্স নিম্নরূপ
@import /*url or list-of-media-queries*/
মিডিয়া প্রশ্নগুলি যৌগিক বিবৃতি হতে পারে যা বিভিন্ন মিডিয়াতে নথির আচরণ নির্দিষ্ট করতে পারে৷
উদাহরণ
নিম্নলিখিত উদাহরণগুলি @import নিয়ম-
প্রয়োগ করেHTML নথি −
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
@import url(style.css);
body {
background-color: honeydew;
}
</style>
</head>
<body>
<p>This is demo paragraph one. </p>
<p class="two">This is demo paragraph two.</p>
<p>This is demo paragraph three</p>
</body>
</html> CSS নথি:style.css
p { color: navy; font-style: italic; }
.two { color: darkgreen; font-size: 24px; } আউটপুট
এটি নিম্নলিখিত আউটপুট −
উৎপন্ন করে
উদাহরণ
HTML নথি -
<!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <div></div> </body> </html>
CSS নথি −
div {
height: 50px;
width: 100px;
border-radius: 20%;
border: 2px solid blueviolet;
box-shadow: 22px 12px 3px 3px lightblue;
position: absolute;
left: 30%;
top: 20px;
} আউটপুট
এটি নিম্নলিখিত আউটপুট দেয় -
