Al diseñar una página , CSS es una parte indispensable del trabajo. A menudo escucho a la gente decir: HTML es cómo se ve una persona sin maquillaje, y agregar CSS es cómo se ve una persona después del maquillaje. Esta oración es fácil de entender y explica muy bien la relación entre CSS y HTML.
Hay muchas propiedades en CSS. Este artículo explica principalmente el estilo del mouse CSS, es decir, la propiedad del cursor CSS y sus muchos valores opcionales. Por ejemplo, la forma de la mano del cursor usa la propiedad cursor:puntero.
1. Sintaxis básica del cursor CSS
¿Qué es el atributo del cursor? Se refiere a la forma del cursor que aparece cuando el puntero del mouse se coloca dentro del límite de un elemento. Incluye signos de interrogación, manos pequeñas y otras formas.
Al usarlo, puede insertar style=cursor: un determinado valor de atributo en cualquier etiqueta que desee agregar, o puede agregarlo en el estilo CSS.
Por ejemplo:
puntero, forma de mano pequeña
ayuda, ayuda a dar forma.
Hay más de una docena de valores opcionales para los valores de atributos del cursor . Simplemente elija el valor apropiado según sus necesidades durante el trabajo.
2. Valor del atributo del cursor CSS
Consejo: debido a los diferentes sistemas informáticos, habrá ciertas diferencias en los estilos del mouse.
Ejemplo:
<!DOCTYPEhtml><html><head><style>div{height:30px;border:1pxsolidgreen;margin-top:10px;}.cell{cursor:cell;}.crosshair{cursor:crosshair;}.text{cursor :texto ;}.vertical-text{cursor:vertical-text;}.alias{cursor:alias;}.copiar{cursor:copiar;}.move{cursor:move;}.no-drop{cursor:no-drop;} </estilo></cabeza><cuerpo><divclase =celda>cursor:celda;</div><divclass=cruz>cursor:cruz;</div><divclass=text>cursor:texto;</div><divclass=texto-vertical>cursor:texto-vertical; </div>< divclass=alias>cursor:alias;</div><divclass=copia>cursor:copiar;</div><divclass=move>cursor:move;</div><divclass=no-drop>cursor:no-drop ;</div></body></html>
Puedes ejecutarlo y ver, es muy intuitivo.