CSS caret-color, pointer-events এবং tab-size হলো ফরম ইনপুট ফিল্ডের জন্য কিছু কম পরিচিত প্রোপার্টি। caret-color প্রোপার্টি আমাদের ব্লিংকিং ক্যারের রঙ নির্দিষ্ট করতে দেয়, pointer-events ব্যবহারকারীদের একটি এলিমেন্ট খুঁজে পাওয়া থেকে রোধ করতে সাহায্য করতে পারে। অবশেষে, tab-size ট্যাব দ্বারা ব্যবহৃত সাদা স্পেসের পরিমাণ সেট করে।
নিচের উদাহরণগুলো এই প্রোপার্টিগুলোর কিছু প্রদর্শন করে।
উদাহরণ
<!DOCTYPE html> <html> <head> <style> body { display: flex; flex-direction: column; background-color: mistyrose; } p { white-space: pre; } p:last-of-type { tab-size: 32; -moz-tab-size: 32; pointer-events: none; } </style> </head> <body> <p> Ut sed felis lobortis, fermentum magna vitae, imperdiet lectus.</p> <p> Ut sed felis lobortis, <a href=#>fermentum magna vitae</a>, imperdiet lectus.</p> </body> </html>
আউটপুট
এটি নিচের ফলাফল দেবে −
উদাহরণ
<!DOCTYPE html> <html> <head> <style> form { padding: 2%; margin: 3%; background-color: cadetblue; text-align: center; } form:focus-within { box-shadow: 0 0 10px rgba(0,0,0,0.6); } input { caret-color: navy; font-size: 40px; font-weight: large; } </style> </head> <body> <form> <select> <option>.</option> <option>..</option> <option>...</option> </select> <input type="text" value="glee" /> </form> </body> </html>
আউটপুট
এটি নিচের ফলাফল দেবে −
