top বৈশিষ্ট্য

top বৈশিষ্ট্যটি মূল উপাদানের শীর্ষ থেকে উপাদানের শীর্ষ প্রান্তের অবস্থান নির্দেশ করে। বৈশিষ্ট্যের মানগুলি সাধারণত গৃহীত আকারের একক সহ নির্ধারণ করা যেতে পারে, যেমন পিক্সেল, ইঞ্চি, পয়েন্ট, শতাংশ। নির্ধারিত মানগুলি ঋণাত্মক সংখ্যাও হতে পারে, এই ক্ষেত্রে উপাদানগুলি একে অপরের উপর স্তূপীকৃত হবে। স্থানাঙ্কের গণনা position বৈশিষ্ট্য দ্বারা নির্ধারিত হয়, যেটি সাধারণত relative (আপেক্ষিক অবস্থান) বা absolute (পরম অবস্থান) মান গ্রহণ করে।

সিনট্যাক্স

সিলেক্টর {
	top: আকার বা auto;
}

উদাহরণ

চাইল্ড উপাদানের উপর হোভার করলে এর শীর্ষ সীমানার অবস্থান 25px-এ সেট করা যাক:

<div id="elem">
	<p></p>
</div>

#elem {
	width: 400px;
	height: 300px;
	border: 1px solid black;
}
p {
	position: relative;
	width: 100px;
	height: 100px;
	border: 1px solid red;
	margin-top: 50px;
	margin-left: 50px;
}
p:hover {
	top: 25px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

উদাহরণ

এবার হোভার করলে চাইল্ড উপাদানের শীর্ষ সীমানা -50px-এ অবস্থান করুক:

<div id="elem">
	<p></p>
</div>

#elem {
	width: 400px;
	height: 300px;
	border: 1px solid black;
}
p {
	position: relative;
	margin-top: 50px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
	margin-left: 50px;
}
p:hover {
	top: -50px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

আরও দেখুন

bottom বৈশিষ্ট্য,
যা উপাদানের নীচের প্রান্তের অবস্থান নির্দেশ করে
left বৈশিষ্ট্য,
যা উপাদানের বাম প্রান্তের অবস্থান নির্দেশ করে
right বৈশিষ্ট্য,
যা উপাদানের ডান প্রান্তের অবস্থান নির্দেশ করে
::backdrop সিউডো-এলিমেন্ট,
যা প্রথম উপাদানের পরে অবস্থান নির্দেশ করে
caption-side বৈশিষ্ট্য,
যা টেবিলের শিরোনামের অবস্থান নির্দেশ করে