Less, el CSS variable

Less no es más que una ampliación de las hojas de estilo (CSS) que ya conocemos, pero con algunas diferencias y mas orientada al campo de la programación, ya que posee la virtud de realizar operaciones, funciones y uso de variables.

Hay que tener claro desde el principio que Less no reemplaza a CSS, de hecho el resultado final es una hoja de estilos css pero con mejoras en el area de desarrollo.

Se vincula exactamente igual que un css, puedes importarlas a un css o vincular directamente a un documento: por ejemplo:

<link rel=”stylesheet/less” href=”style.less” type=”text/css”>

¿Cuándo utilizarlo?

Less toma ventaja cuando tenemos una plataforma web en la que necesitamos cambiar colores o variables, en un proyecto grande, si tenemos por ejemplo declarado un color como variable, simplemente cambiándolo en un lugar afectaría a toda la plataforma donde esta esa variable repetida, y sería menos engorroso realizar el cambio.

Algunas diferencias respecto a CSS:

(para definir una variable en LESS utilizamos el símbolo @)

@colorUno: #383939;
@colorDos: #66bbe3;

A partir de ahora cada vez que queramos utilizar un color solo tenemos que incluir la variable en lugar del código hexadecimal del color. ¿Más fácil de recordar no? Nuestro CSS quedaría así:

background-color: @colorUno;
color: @ colorDos;
si en un futuro decidimos cambiar los colores de nuestra web, solo tendremos que cambiar la variable de LESS y no perderemos el tiempo modificando un montón de lineas de nuestro CSS

 

Ventajas Inconvenientes
  • Utilizar variables
  • Un css unico con variables
  • Crear operaciones con JavaScript
  • Conocimientos de programación
  • Más código
  • Se tarda más tiempo en implementar

Leave a Reply

Your email address will not be published. Required fields are marked

Centro de preferencias de privacidad

Cookies

El acceso a este Sitio Web puede implicar la utilización de cookies. Las cookies son pequeñas cantidades de información que se almacenan en el navegador utilizado por cada Usuario —en los distintos dispositivos que pueda utilizar para navegar— para que el servidor recuerde cierta información que posteriormente y únicamente el servidor que la implementó leerá. Las cookies facilitan la navegación, la hacen más amigable, y no dañan el dispositivo de navegación.

Las cookies son procedimientos automáticos de recogida de información relativa a las preferencias determinadas por el Usuario durante su visita al Sitio Web con el fin de reconocerlo como Usuario, y personalizar su experiencia y el uso del Sitio Web, y pueden también, por ejemplo, ayudar a identificar y resolver errores.

La información recabada a través de las cookies puede incluir la fecha y hora de visitas al Sitio Web, las páginas visionadas, el tiempo que ha estado en el Sitio Web y los sitios visitados justo antes y después del mismo. Sin embargo, ninguna cookie permite que esta misma pueda contactarse con el número de teléfono del Usuario o con cualquier otro medio de contacto personal. Ninguna cookie puede extraer información del disco duro del Usuario o robar información personal. La única manera de que la información privada del Usuario forme parte del archivo Cookie es que el usuario dé personalmente esa información al servidor.

Las cookies que permiten identificar a una persona se consideran datos personales. Por tanto, a las mismas les será de aplicación la Política de Privacidad anteriormente descrita. En este sentido, para la utilización de las mismas será necesario el consentimiento del Usuario. Este consentimiento será comunicado, en base a una elección auténtica, ofrecido mediante una decisión afirmativa y positiva, antes del tratamiento inicial, removible y documentado.

cookie_notice_accepted, PHPSESSID, gdpr[allowed_cookies], gdpr[consent_types], wfvt_854953179, wfwaf-authcookie-6551efe13cbfd0f309df2196394f1ef4, wordfence_verifiedHuman, wp-settings-1, wordpress_logged_in_b03ee833495d0a37b6d465ed4571f165, wordpress_test_cookie, wp-settings-time-1, wordpress_b03ee833495d0a37b6d465ed4571f165
1P_JAR, CONSENT, GMAIL_LOGIN, HSID, NID, SID, SIDCC
ELOQUA, _ga, _lipt, bcookie, lang, liap, lidc

¿Quieres cerrar tu cuenta?

Se cerrará tu cuenta y todos los datos se borrarán de manera permanente y no se podrán recuperar ¿Estás seguro?

Translate »
Twitter
LinkedIn