কম্পিউটার

CSS ব্যবহার করে কার্সারের চেহারা পরিবর্তন করা


আমরা CSS কার্সার প্রপার্টি ব্যবহার করে একটি HTML নথিতে বিভিন্ন উপাদানের জন্য কার্সার ইমেজ ম্যানিপুলেট করতে পারি।

সিনট্যাক্স

The syntax of CSS cursor property is as follows:
Selector {
   cursor: /*value*/
}

CSS কার্সার প্রপার্টি -

এর জন্য নিম্নোক্ত মান রয়েছে
Sr.No মান ও বর্ণনা
1 উনাম
এটি নির্দেশ করে যে কিছুর একটি উপনাম তৈরি করা হবে
2 অল-স্ক্রোল
এটি নির্দেশ করে যে কোনও কিছু যে কোনও দিকে স্ক্রোল করা যেতে পারে
3 স্বয়ংক্রিয়
এটি ডিফল্ট এবং ব্রাউজার একটি কার্সার সেট করে
4 সেল
এটি নির্দেশ করে যে একটি ঘর (বা কোষের সেট) নির্বাচন করা হতে পারে
5 প্রসঙ্গ-মেনু
এটি নির্দেশ করে যে একটি প্রসঙ্গ-মেনু উপলব্ধ
6 কল-রিসাইজ
এটি নির্দেশ করে যে কলামটি অনুভূমিকভাবে পুনরায় আকার দেওয়া যেতে পারে
7 কপি
এটি নির্দেশ করে যে কিছু অনুলিপি করা হবে
8 ক্রসশেয়ার
এটি একটি crosshair হিসাবে রেন্ডার
9 ডিফল্ট
এটি ডিফল্ট কার্সার রেন্ডার করে
10 ই-রিসাইজ
এটি নির্দেশ করে যে একটি বাক্সের একটি প্রান্ত ডানদিকে (পূর্ব দিকে) সরানো হবে
11 ew-resize
এটি একটি দ্বিমুখী রিসাইজ কার্সার নির্দেশ করে
12 দখল
এটি ইঙ্গিত দেয় যে কিছু দখল করা যেতে পারে
13 দখল
এটি ইঙ্গিত দেয় যে কিছু দখল করা যেতে পারে
14 সহায়তা
এটি নির্দেশ করে যে সাহায্য পাওয়া যায়
15 সরান
এটি নির্দেশ করে যে কিছু সরানো হবে
16 n-resize
এটি নির্দেশ করে যে একটি বাক্সের একটি প্রান্ত উপরে (উত্তর) সরানো হবে
17 ন-রিসাইজ
এটি নির্দেশ করে যে একটি বাক্সের একটি প্রান্ত উপরে এবং ডানে (উত্তর/পূর্ব) সরানো হবে
18 new-resize
এটি একটি দ্বিমুখী রিসাইজ কার্সার নির্দেশ করে
19 ns-resize
এটি একটি দ্বিমুখী রিসাইজ কার্সার নির্দেশ করে
20 nw-resize
এটি নির্দেশ করে যে একটি বাক্সের একটি প্রান্ত উপরে এবং বামে (উত্তর/পশ্চিম) সরানো হবে
21 nwse-resize
এটি একটি দ্বিমুখী রিসাইজ কার্সার নির্দেশ করে
22 নো-ড্রপ
এটি নির্দেশ করে যে টেনে আনা আইটেমটি এখানে ড্রপ করা যাবে না
23 কোনটিই নয়
উপাদানের জন্য কোন কার্সার রেন্ডার করা হয় না
24 অনুমোদিত
এটি নির্দেশ করে যে অনুরোধ করা পদক্ষেপটি কার্যকর করা হবে না
25 পয়েন্টার
এটি একটি পয়েন্টার এবং একটি লিঙ্ক নির্দেশ করে
26 প্রগতি
এটি নির্দেশ করে যে প্রোগ্রামটি ব্যস্ত (প্রগতিতে)
27 সারির আকার পরিবর্তন করুন
এটি নির্দেশ করে যে সারিটি উল্লম্বভাবে পুনরায় আকার দেওয়া যেতে পারে
28 s-রিসাইজ
এটি নির্দেশ করে যে একটি বাক্সের একটি প্রান্ত নীচে (দক্ষিণ) সরানো হবে
২৯ সে-রিসাইজ
এটি নির্দেশ করে যে একটি বাক্সের একটি প্রান্ত নীচে এবং ডানদিকে সরানো হবে (দক্ষিণ/পূর্ব)
30 sw-resize
এটি নির্দেশ করে যে একটি বাক্সের একটি প্রান্ত নীচে এবং বামে সরানো হবে (দক্ষিণ/পশ্চিম)
31 পাঠ্য
এটি নির্বাচন করা হতে পারে এমন পাঠ্য নির্দেশ করে
32 URL
একটি ব্যর্থ নিরাপদ হিসাবে শেষে উল্লেখ করা জেনেরিক কার্সার সহ কাস্টম কার্সারগুলিতে ইউআরএলগুলির একটি কমা দ্বারা পৃথক করা তালিকা
33 উল্লম্ব-পাঠ্য
এটি উল্লম্ব-পাঠ্য নির্দেশ করে যা নির্বাচিত হতে পারে
34 w-resize
এটি নির্দেশ করে যে একটি বাক্সের একটি প্রান্ত বামে (পশ্চিমে) সরানো হবে
35 অপেক্ষা করুন
এটি নির্দেশ করে যে প্রোগ্রামটি ব্যস্ত
36 জুম ইন
এটি নির্দেশ করে যে কিছু জুম করা যেতে পারে
37 জুম-আউট
এটি নির্দেশ করে যে কিছু জুম আউট করা যেতে পারে
38 প্রাথমিক
এটি কার্সার প্রপার্টি তার ডিফল্ট মান সেট করে।
39 উত্তরাধিকার
এটি এটির মূল উপাদান থেকে কার্সার সম্পত্তি উত্তরাধিকারসূত্রে পায়।

CSS কার্সার প্রপার্টি

বাস্তবায়নের জন্য নিচের একটি উদাহরণ

উদাহরণ

<!DOCTYPE html>
<html>
<head>
<style>
div {
   margin: 5px;
   float: left;
}
#one {
   background-color: beige;
}
#two {
   background-color: lavender;
}
.n-resize {cursor: n-resize;}
.ne-resize {cursor: ne-resize;}
.nw-resize {cursor: nw-resize;}
.not-allowed {cursor: not-allowed;}
.pointer {cursor: pointer;}
</style></head>
<body>
<div id="one">
<div class="nw-resize">left corner</div><div class="n-resize">up</div>
<div class="ne-resize">right corner</div>
</div>
<div id="two">
<div class="not-allowed">Not-allowed</div><div class="pointer">Pointer</div>
</div>
</body>
</html>

আউটপুট

CSS ব্যবহার করে কার্সারের চেহারা পরিবর্তন করা


  1. CSS-এ শতাংশ এবং Em-এর সমন্বয় ব্যবহার করা

  2. CSS ব্যবহার করে লিঙ্কের রঙ সেট করা

  3. CSS ব্যবহার করে এলিমেন্টের টেক্সট কালার সেট করা

  4. CSS ব্যবহার করে স্ক্রীন সাইজের উপর ভিত্তি করে লেআউট পরিবর্তন করা