El cursor de la Cruz es una forma elegante y original de atraer la atenci n de los usuarios en su sitio web. Este cursor se ve inusual y le permite hacer que los elementos interactivos sean m s visibles. En este art culo, le diremos c mo hacer un cursor en forma de Cruz de manera f cil y r pida.
Para hacer una Cruz del cursor, solo necesita unos pocos pasos. Primero, abra cualquier Editor de c digo y cree un nuevo archivo con la extensi n CSS. Luego ingrese el siguiente c digo:
body {
cursor: url( crosshair.png ), auto;
}
En este c digo, especificamos que el cursor debe usar la imagen "crosshair.png " en formato PNG. Tambi n puede usar otras im genes reemplazando " crosshair.png " a la ruta de archivo correspondiente.
- C mo hacer una Cruz de cursor
- Preparaci n de herramientas
- Crear una imagen de cursor
- Subir imagen al servidor
- Crear c digo CSS para el cursor
- Aplicar cursor nativo en HTML
- Colocar el cursor en una p gina web
- Comprobaci n del cursor
- Pregunta-respuesta
- C mo hacer una Cruz del cursor en el ordenador?
- D nde est la configuraci n del cursor en la computadora?
- Es posible hacer una Cruz del cursor en la computadora usando un programa?
- Es posible hacer una Cruz de cursor en Mac?
- Es posible hacer una Cruz del cursor en Windows 10?
C mo hacer una Cruz de cursor
A veces es necesario resaltar el cursor en la pantalla para llamar la atenci n del usuario o se alar un rea espec fica. Una forma de hacerlo es cambiar la forma est ndar del cursor a una Cruz.
- Abra el panel de control en su sistema operativo. Para Windows se encuentra en el men Inicio.
- En el cuadro de b squeda del panel de control, escriba "configuraci n del cursor".
- Seleccione el resultado "Cambiar la forma del puntero del mouse".
- En la ventana que se abre, haga clic en la pesta a Esquemas.
- Elija un Esquema que le guste, como "tallas Grandes (plata)".
- Haga clic en el bot n "Aplicar" y luego en "aceptar".
Nota: Puede haber una interfaz de panel de control ligeramente diferente en diferentes versiones del sistema operativo y en diferentes computadoras, pero los pasos generales deber an ser los mismos.
Ahora su cursor debe tener la forma de una Cruz. Si desea volver a la forma est ndar del cursor, repita los pasos anteriores y seleccione uno de los esquemas est ndar.
Preparaci n de herramientas
Para crear un cursor en forma de Cruz, necesitar las siguientes herramientas:
- Editor de im genes-un programa para crear y editar im genes. Por ejemplo, Adobe Photoshop, GIMP o Paint.NET.
- Cursor en forma de Cruz-la imagen del cursor en forma de Cruz. Puede encontrar im genes terminadas en l nea o crear la suya propia. Se recomienda utilizar una imagen de cursor en formato PNG con un fondo transparente.
Una vez que haya preparado todas las herramientas necesarias, puede pasar al siguiente paso: crear un archivo CSS y codificar el cursor.
Crear una imagen de cursor
Para crear una imagen de cursor, siga estos pasos::
- Seleccione la imagen que desea utilizar como cursor. Puede usar una imagen terminada o crear una propia.
- Preparar la imagen para su uso como cursor. Para hacer esto, debe procesarlo con la ayuda de programas o servicios especiales. Por lo general, es necesario cambiar el Tama o de la imagen y guardarla en un formato especial (.cur o .ani).
- . El valor de la propiedad puede ser una URL que hace referencia a un archivo con la imagen del cursor o una palabra clave que describe el tipo de cursor.
- .
Aqu hay una regla CSS de ejemplo para usar su propia imagen de cursor:
body {cursor: url(cursor.cur), default;
}
En este ejemplo, la imagen del cursor debe estar en el mismo directorio que el archivo HTML. Si la imagen del cursor se usa solo para un elemento espec fico, la aplicaci n de la regla CSS puede limitarse solo a ese elemento.
Por lo tanto, la creaci n de una imagen de cursor implica seleccionar una imagen, prepararla, conectarse a una p gina web y aplicarla a los elementos deseados.
Subir imagen al servidor
Para cargar una imagen en el servidor, siga estos pasos::
- Crear un controlador para recuperar y guardar la imagen cargada en el servidor. El controlador puede ser escrito en PHP, Python, Ruby, etc. , PHP :
$uploadOk = 0;
- }
if ($uploadOk == 0) {
echo " .";
// ,
} else {
- echo " ". basename( $_FILES["image"]["name"]). "se carg con xito.";
- echo " se Produjo un error al cargar el archivo.";
}
}
|
En este c digo, usamos la propiedad CSS del cursor para establecer el cursor en forma de Cruz. El valor crosshair indica que el cursor debe parecerse a una Cruz.
Despu s de agregar este c digo, guarde el archivo de estilo y con ctelo a la p gina HTML usando la etiqueta .
- Ahora, cuando el usuario pasa el cursor sobre los elementos de su p gina web, ver una Cruz en lugar de una flecha normal.
- Aplicar cursor nativo en HTML
- El cursor es un elemento gr fico especial que sigue el puntero del mouse cuando interact a con una p gina web.
- En HTML, hay una opci n para cambiar la vista del cursor y aplicar su propia imagen en lugar del cursor est ndar. Para ello se utiliza la propiedad CSS
cursor
.
Propiedad
cursor
puede tomar diferentes valores, tales como:
auto
- cursor est ndar por defecto;
default
- forma de cursor est ndar;
pointer
- cursor en forma de puntero, generalmente utilizado para referencias;
text
- cursor en forma de barra vertical que indica la entrada de texto;