Ao fazer o layout de uma página , CSS é uma parte indispensável do trabalho. Muitas vezes ouço as pessoas dizerem: HTML é a aparência de uma pessoa sem maquiagem, e adicionar CSS é a aparência de uma pessoa depois da maquiagem. Esta frase é fácil de entender e explica muito bem a relação entre CSS e HTML.
Existem muitas propriedades em CSS. Este artigo explica principalmente o estilo do mouse CSS, ou seja, a propriedade cursor CSS e seus muitos valores opcionais. Por exemplo, a forma da mão do cursor usa a propriedade cursor:pointer.
1. Sintaxe básica do cursor CSS
O que é o atributo cursor? Refere-se à forma do cursor que aparece quando o ponteiro do mouse é colocado dentro do limite de um elemento. Inclui pontos de interrogação, mãos pequenas e outras formas.
Ao usá-lo, você pode inserir style=cursor: um determinado valor de atributo em qualquer tag que deseja adicionar ou pode adicioná-lo no estilo CSS.
por exemplo:
ponteiro, formato de mão pequena
ajude, ajude a moldar.
Existem mais de uma dúzia de valores opcionais para os valores dos atributos do cursor . Basta escolher o valor apropriado de acordo com suas necessidades durante o trabalho.
2. Valor do atributo do cursor CSS
Dica: Devido aos diferentes sistemas de computador, haverá algumas diferenças nos estilos de mouse.
Exemplo:
<!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;}.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><divclass=vertical-text>cursor:vertical-text; </div>< divclass=alias>cursor:alias;</div><divclass=copy>cursor:copy;</div><divclass=move>cursor:move;</div><divclass=no-drop>cursor:no-drop ;</div></body></html>Você pode executá-lo e ver, é muito intuitivo.