Share
Volvemos con la segunda entrada en la serie Nettuts + Q&A. Hoy, discutimos la diferencia entre LESS y Sass, cómo pasar los valores del lado del servidor a su JavaScript, cómo trabajar con PHP y las cookies, y el doctype HTML5. Aquí vamos!
Hey Nettuts +. Estoy confundido. ¿Cuál es la diferencia entre LESS y Sass? Son lo mismo?
Hay ventajas al usar ambos; Sin embargo, la verdad es que ambos harán el trabajo maravillosamente. En su mayoría se convierte en un caso de preferencia, cuando se trata de la sintaxis y tal. En el pasado, muchos preferían MENOS, porque tenía una sintaxis similar a CSS más amigable, sin embargo, a partir de Sass 3, tienen una nueva sintaxis, conocida como SCSS (Sassy CSS), que es simplemente un subconjunto de la sintaxis de CSS3.
Los desarrolladores de Envato usan Sass. Otro desarrollador popular prefiere MENOS. Lo compararía con la comparación del marco de trabajo 960 CSS con Blueprint. Ambos son geniales así que decídete. No hay respuestas equivocadas!
¿Quieres aprender más sobre LESS en Nettuts+?
He estado tratando de averiguar cómo pasar el valor de una variable de PHP a mi JavaScript. ¿Cómo hago esto? Gracias!
La solución más rápida y sencilla es hacer eco de su variable deseada desde su JavaScript. Por ejemplo, puede consultar su base de datos MySQL con PHP, y luego pasar el valor devuelto a su JavaScript haciendo lo siguiente:
Gesto de desaprobación
¿Cómo puedo elegir dinámicamente una hoja de estilo de esquema de color para mi sitio web??
Así que quieres, por ejemplo, elegir red.css, o azul.css, y eso cargaría un esquema de color diferente para su sitio web. ¿Es eso lo que quieres decir? Ciertamente, hay varias formas de realizar esta tarea, y la elección correcta dependerá de si está utilizando un marco de trabajo, un CMS, MVC, etc. Mantengamos las cosas simples y lo más escueto posible. Podemos usar PHP sesiones. Primero, necesitamos agregar un seleccionar Caja, para que el usuario elija la hoja de estilo de color deseada..
Gesto de desaprobación Elija su hoja de estilo
A continuación, con PHP, escucharemos si la página se ha publicado de nuevo, o si el Enviar Se ha hecho clic en el botón. Con una página tan simple como esta, podemos usar el útil $ _SERVER ['REQUEST_METHOD'].
El "Método de solicitud" determina qué método de solicitud se utilizó para acceder a la página: 'GET', 'HEAD', 'POST', 'PUT' "
En la parte superior de su página, agregue lo siguiente:
Como ahora podemos confirmar cuando la página se ha publicado, podemos crear un sesión, y almacene el valor de lo que el usuario elija en el cuadro de selección.
Aquí, primero estamos creando una nueva sesión de PHP, con session_start (). A continuación, creamos una nueva clave, con $ _SESION, llamado "color_scheme". Siéntase libre de nombrar esto como desee. De forma predeterminada, configuramos esto en "predeterminado" (ver la declaración "else"). Esto significa que, si el usuario no ha seleccionado una hoja de estilo, usaremos la predeterminada. Sin embargo, si hicieron una elección, necesitamos determinar qué opción del seleccionar elemento que eligieron, y almacenarlo en una clave de sesión.
Volviendo al marcado, encontrará que aplicamos un nombre de "colores" a la seleccionar elemento.
Cuando la página vuelve a publicarse, valor seleccionado de esta seleccionar elemento estará disponible para nosotros, a través de $ _POST ['colores']. Por ejemplo, si elijo la opción "verde", $ _POST ['colores'] entonces será igual a "verde".
Sin sesiones y cookies, no habría manera de "recordar" este valor seleccionado por el usuario. Es por eso que son esenciales en este caso. Ahora eso $ _SESSION ['color_scheme'] almacena nuestro valor deseado, solo necesitamos cargar la hoja de estilo apropiada.
Gesto de desaprobación
Hola Nettuts +! ¿Cómo creo entradas de formulario redondeadas con CSS para todos los navegadores??
¿Desea entradas estilizadas y redondeadas en todos los navegadores, incluido Internet Explorer? De acuerdo ♥. Considere el siguiente marcado simple:
Usando algunos CSS3 simples, podemos crear esquinas redondeadas para esas entradas. Debido a que algunos navegadores obtuvieron una ventaja inicial en la especificación, necesitamos usar el -moz y -webkit prefijos de los proveedores, así como la versión oficial de la propiedad "border-radius".
Especificando un
tipoatributo deenviar, ese último fragmento de código solo apuntará a los botones de envío, y se estilizará según corresponda.
Desafortunadamente, como probablemente adivinaste, Internet Explorer es un imbécil. Mientras que el próximo IE9 tiene soporte para radio del borde (sin un prefijo), las versiones anteriores aún están perdidas. En este punto, tienes dos opciones:
Supongo que el que pregunta esta pregunta requiere coherencia; Así que vamos a ir con la segunda opción. Supongamos que va a trabajar mucho con CSS3 y HTML5 en su proyecto. En ese caso, en lugar de usar una hoja de estilo solo para IE, ¿por qué no divertirse y usar la útil biblioteca Modernizr??
Primero, descargue Modernizr y haga referencia al archivo modernizr.js dentro de su proyecto.
Gesto de desaprobación
A continuación, aplique una clase de no-js al Html elemento en tu pagina.
Cuando vea su proyecto en el navegador, Modernizr aplicará una larga serie de clases al Html Elemento, que especifica exactamente lo que su navegador es capaz de hacer. Tenga en cuenta que, obviamente, esta lista de clases variará, dependiendo del navegador.
¡Esta es una gran ayuda! Ahora podemos usar el efecto "cascada" para apuntar solo a los elementos de formulario que son hijos de html Elemento con una clase de "no-borderradius" y estilo en consecuencia.
Si el navegador no es compatible con una característica en particular, la palabra "no" será prefijada a la regla.
/ * Solo se dirige a los navegadores que no admiten la entrada de borde-radio * / .no-borderradius background: url (path / to / rounded / background / image) no-repeat;
Y luego nos relajamos y tenemos pastel..
Noté que siempre usas el doctype HTML5. ¿No crees que es peligroso, cuando todos los navegadores aún no admiten HTML5??
No, no es peligroso en absoluto. Para aquellos que no están familiarizados con el doctype HTML5 maravillosamente simple, es:
En serio ... eso es todo. Eso es todo al respecto. No más disputas multilínea de atributos; Solo un DOCTYPE simple, como debería ser. En navegadores más antiguos, este doctype los activará en modo estándar... Y si todavía estás preocupado, ¡ten en cuenta que incluso Google lo usa! ¿Necesitar más? John Resig hablaba de esto hace 2.5 años.!
"Lo bueno de este nuevo DOCTYPE, especialmente, es que todos los navegadores actuales (IE, FF, Opera, Safari) lo verán y cambiarán el contenido al modo estándar, aunque no implementen HTML5. Esto significa que podría comience a escribir sus páginas web utilizando HTML5 hoy y haga que duren por mucho, mucho tiempo ".
-John Resig
Si tiene una pregunta de desarrollo web "no muy complicada" para nosotros, puede:
Gracias por leer y mirar!
Accentsconagua