04 Posicionamiento y punto de anclaje de cimentación css

Posicionamiento basado en CSS y posicionamiento de anclaje El
posicionamiento
es un esquema para manipular el diseño de elementos html en CSS. La
posición del atributo es un valor predeterminado
estático
, sin posicionamiento especial, y el objeto sigue el principio HTML; posicionamiento
absoluto
, que arrastra completamente el objeto hacia afuera del flujo del documento, use left / right / top / bottom y otros atributos relativos a su elemento principal más cercano con configuraciones de posicionamiento para el posicionamiento absoluto; si no existe tal objeto principal, se colocará de acuerdo con la página web y su cascada se define por el atributo de índice z; el posicionamiento
relativo
relativo del documento sigue el flujo normal, se desplazará en relación con las posiciones de sus atributos derecho, superior, izquierdo, inferior (ubicación relativa) y otros atributos en el flujo normal del documento; que está definido por las propiedades multicapa del índice Z. Posicionamiento absoluto similar
fijo
Sin embargo, su referencia es la ventana "visual" del navegador, y está fuera del flujo de documentos estándar;
heredar
especifica el método de posicionamiento del elemento para heredar el valor del atributo de posición del elemento padre.
Pegajoso
pegajoso de posicionamiento, el posicionamiento se basa en la posición de desplazamiento del usuario.
Se comporta como posición: relativa; y cuando la página se desplaza más allá del área de destino, se comporta como posición: fija; y se fijará en la posición de destino.
La relación jerárquica del valor predeterminado
automático del índice z del elemento de posicionamiento
. Siguiendo la estructura, el orden de la capa del elemento de posicionamiento escrito más tarde es mayor.
número Un
valor entero sin unidades. Puede ser un número negativo, cuanto mayor sea el valor, mayor será el orden de la capa
Sugerencia
Este atributo solo se aplica a objetos con el valor del atributo de posición relativo o absoluto, fijo.
La jerarquía de los elementos secundarios se verá afectada el elemento principal que
contiene el
concepto de bloque que
contiene el bloque es la base del posicionamiento absoluto, incluido el bloque es para proporcionar coordenadas, desplazamiento y rango de visualización de referencia es elementos absolutamente posicionados que determinan el desplazamiento del punto de partida y el posicionamiento absoluto Porcentaje referencia de longitud; por
defecto, el cuerpo es un bloque contenedor grande, todos los elementos posicionados absolutamente se muestran de acuerdo con la ventana para determinar su posición y tamaño porcentual, si definimos el elemento contenedor como el bloque del elemento contenedor En el futuro, para el contenido elemento de posicionamiento absoluto, su posición de visualización se posicionará de acuerdo con el elemento contenedor superior más cercano con función de posicionamiento.
Defina el elemento como el bloque contenedor: agregue la posición de declaración: relativa | absoulte al elemento padre del elemento posicionado absolutamente;
la diferencia entre el posicionamiento relativo y el posicionamiento absoluto es diferente. El
objeto de referencia del posicionamiento absoluto es el bloque contenedor (padre) , posicionamiento relativo El objeto de referencia es la posición del propio elemento;
el posicionamiento absoluto arrastra el objeto fuera del flujo de documentos para que no ocupe espacio, y el posicionamiento relativo no destruye la secuencia normal del flujo de documentos. No importa si se mueve o no, el elemento todavía ocupa el espacio original. Punto de
anclaje
La realización del punto de anclaje se realiza principalmente a través de una etiqueta.
Función: Saltar a diferentes ubicaciones en la página web.
Úselo para
crear un punto de anclaje.

Objetivo
<nombre de etiqueta id = 'nombre de identificación correspondiente al punto de anclaje'> filtro
transparente
ie9 e inferior
: alfa (opacidad = valor); rango de valores 0- 100
otros navegadores
opacidad: 0.5; (El rango de valor del valor es 0-1 0.1,0.2,0.3 ----- 0.9—1)
rgba (255,255,0,0.5) (el último dígito indica transparencia y el rango de valor es 0- 1) Solo es compatible con la sintaxis
flash del navegador por encima de IE8. Subtítulos en movimiento < comportamiento de la marquesina = "scroll / alternate" direction = "arriba (de abajo hacia arriba) / abajo (de arriba a abajo) / izquierda (de derecha a izquierda) / derecha (de izquierda a derecha) " scrollamount (velocidad de desplazamiento) =" valor "altura =" valor (rango de desplazamiento hacia arriba y hacia abajo) "width =" "(rango de desplazamiento hacia la izquierda y hacia la derecha)> contenido