عند تخطيط الصفحة ، يعد CSS جزءًا لا غنى عنه في العمل كثيرًا ما أسمع الناس يقولون: HTML هو شكل الشخص بدون مكياج، وإضافة CSS هو الشكل الذي يبدو عليه الشخص بعد الماكياج. هذه الجملة سهلة الفهم وتشرح العلاقة بين CSS وHTML جيدًا.
هناك العديد من الخصائص في CSS، تشرح هذه المقالة بشكل أساسي نمط الماوس في CSS، أي خاصية مؤشر CSS، وقيمها الاختيارية العديدة. على سبيل المثال، يستخدم شكل يد المؤشر خاصية المؤشر:.
1. بناء الجملة الأساسي لمؤشر CSS
ما هي خاصية المؤشر؟ تشير إلى شكل المؤشر الذي يظهر عند وضع مؤشر الماوس داخل حدود العنصر، وتشمل علامات الاستفهام والأيدي الصغيرة والأشكال الأخرى.
عند استخدامه، يمكنك إدراج style=cursor: قيمة سمة معينة في أي علامة تريد إضافتها، أو يمكنك إضافتها بنمط CSS.
على سبيل المثال:
مؤشر، شكل يد صغيرة
مساعدة، مساعدة في الشكل.
هناك أكثر من اثنتي عشرة قيمة اختيارية لقيم سمات المؤشر . ما عليك سوى اختيار القيمة المناسبة وفقًا لاحتياجاتك أثناء العمل.
2. قيمة سمة مؤشر CSS
نصيحة: نظرًا لاختلاف أنظمة الكمبيوتر، ستكون هناك اختلافات معينة في أنماط الماوس.
مثال:
<!DOCTYPEhtml><html><head><style>div{height:30px;border:1pxsolidgreen;margin-top:10px;}.cell{cursor:cell;}.crosshair{cursor:crosshair;}.text{cursor :نص؛}.vertical-text{cursor:vertical-text;}.alias{cursor:alias;}.copy{cursor:copy;}.move{cursor:move;}.no-drop{cursor:no-drop ;}</style></head><body><divclass=cell>cursor:cell;</div><divclass=crosshair>cursor:crosshair;</div><divclass=text>cursor:text;</ div> div><divclass=vertical-text>cursor:vertical-text;</div><divclass=alias>cursor:alias;</div><divclass=copy>cursor:copy;</div><divclass= نقل> المؤشر: نقل;</div><divclass=no-drop>المؤشر:no-drop;</div></body></html>
يمكنك تشغيله ورؤيته، فهو بديهي للغاية.