El término "elementos fijos" en Tumblr se refiere a cualquier objeto en su tema de Tumblr que no se mueve en relación con la ventana del navegador. Por ejemplo, su tema puede tener una barra lateral fija. En este caso, la barra lateral no se mueve cuando se desplaza hacia abajo en la página; siempre permanece en el mismo lugar en relación con la ventana del navegador. Los elementos fijos se definen en el código de Hojas de estilo en cascada de su tema.
HTML y CSS
Todos los temas de Tumblr se definen mediante una combinación de HTML y CSS. En general, HTML controla la estructura de un tema, mientras que CSS dicta su estilo. Muchos sitios web tienen archivos HTML y CSS separados. Sin embargo, el HTML y CSS de un tema típico de Tumblr existen juntos en un código fuente unificado.
Encontrar el CSS de su tema
Para localizar el código fuente de su tema, debe iniciar sesión en su cuenta de Tumblr. Desde su tablero, haga clic en el ícono de ajustes para acceder al menú Configuración. En el menú Configuración, seleccione el blog que desea ver. En el menú de personalización del blog, haga clic en "Personalizar" en la sección Tema. Esto lo llevará a la página de personalización del tema. Debajo del título de su tema, haga clic en "Editar HTML". Esto mostrará el HTML y CSS de su tema.
La posición: propiedad fija
Dentro del código de su tema, puede presionar "Ctrl-F" para buscar elementos específicos. Si escribe "posición: fija" en el campo de búsqueda, puede recorrer diferentes instancias de elementos fijos en su tema. Si su búsqueda no arroja resultados o menos de lo esperado, intente buscar "posición: fija" sin espacios después de los dos puntos. El elemento fijo se nombrará antes del corchete "{". Por ejemplo, #sidebar {position: fixed;} arreglaría un elemento con el ID de la "barra lateral".
Colocación de los elementos
Una vez que se ha especificado el método de posicionamiento de un elemento, puede moverlo a lo largo de los ejes horizontal o vertical en un cierto número de píxeles. Para hacer esto, especifique el borde del contenedor del elemento y el número de píxeles que desea separar el elemento de ese borde. Por ejemplo, #sidebar {posición: fija; superior: 20px; right: 10px;} colocará la barra lateral a 20 píxeles de la parte superior de la ventana del navegador y 10 píxeles de la derecha de la ventana del navegador.
Cambio de elementos fijos
Si localiza un elemento fijo, puede cambiar la forma en que está posicionado. El atributo "position: static" fija la posición del elemento en relación con su lugar en el flujo del código HTML. Este atributo se utiliza para compensar el elemento en una cierta cantidad de su posición estática normal. Por ejemplo, #sidebar {posición: relativa; right: 20px;} compensaría el elemento #sidebar 20 píxeles de su borde derecho normal. Por último, el atributo position: absolute elimina el elemento del flujo de documentos y lo coloca en relación con su elemento contenedor. Por ejemplo, si un elemento de posición absoluta está dentro de un elemento de posición relativa, cualquier alteración de su posición se producirá en relación con el elemento de posición relativa. Puede experimentar con estos diferentes tipos de posicionamiento para personalizar qué elementos se fijan en su tema de Tumblr.
