Πίνακας περιεχομένων:

Πώς κεντράρετε με την απόλυτη τοποθέτηση;
Πώς κεντράρετε με την απόλυτη τοποθέτηση;

Βίντεο: Πώς κεντράρετε με την απόλυτη τοποθέτηση;

Βίντεο: Πώς κεντράρετε με την απόλυτη τοποθέτηση;
Βίντεο: CSS - ΜΑΘΗΜΑ 6.2 - POSITIONING - ΜΕΡΟΣ 2 ΑΠΟ 4 - Σχετική (relative) τοποθέτηση 2024, Νοέμβριος
Anonim

Για να κεντράρετε ένα στοιχείο χρησιμοποιώντας απόλυτη τοποθέτηση, απλώς ακολουθήστε τα εξής βήματα:

  1. Προσθέστε αριστερά: 50% στο στοιχείο που θέλετε κέντρο .
  2. Προσθέστε ένα αρνητικό αριστερό περιθώριο ίσο με το μισό πλάτος του στοιχείου.
  3. Στη συνέχεια, θα κάνουμε μια παρόμοια διαδικασία για τον κατακόρυφο άξονα.
  4. Στη συνέχεια, προσθέστε ένα αρνητικό άνω περιθώριο ίσο με το μισό ύψος του.

Σχετικά με αυτό, πώς κεντράρετε το απόλυτο κείμενο;

Απόλυτο Κέντρο χρησιμοποιώντας μετάφραση Αν θέλετε κέντρο κάτι οριζόντια στο CSS μπορείτε να το κάνετε απλά χρησιμοποιώντας το κείμενο -ευθυγραμμίζω: κέντρο ; (όταν εργάζεστε με ενσωματωμένα στοιχεία) ή περιθώριο: 0 αυτόματο. (όταν εργάζεστε με στοιχείο μπλοκ).

Ομοίως, τι είναι η απόλυτη τοποθέτηση; Ένα στοιχείο με θέση : απόλυτος ; είναι τοποθετημένος σε σχέση με το πλησιέστερο τοποθετημένος πρόγονος (αντί για τοποθετημένος σε σχέση με το παράθυρο προβολής, σαν σταθερό). Ωστόσο; αν μία απόλυτο τοποθετημένο στοιχείο δεν έχει αρ τοποθετημένος προγόνων, χρησιμοποιεί το σώμα του εγγράφου και κινείται παράλληλα με την κύλιση της σελίδας.

Γνωρίζετε επίσης πώς κεντρίζω ένα κοντέινερ στη σελίδα;

Μέθοδος στοίχισης κειμένου

  1. Περικλείστε το div που θέλετε να κεντράρετε με ένα γονικό στοιχείο (κοινώς γνωστό ως περιτύλιγμα ή κοντέινερ)
  2. Ορίστε το "text-align: center" στο γονικό στοιχείο.
  3. Στη συνέχεια, ρυθμίστε το εσωτερικό div σε "display: inline-block"

Πώς κεντράρετε ένα αντικείμενο σε HTML;

Το χαρακτηριστικό align του < αντικείμενο > δεν υποστηρίζεται σε HTML5. Χρησιμοποιήστε το CSS. Για ένα αντικείμενο για να στοιχίσετε στη μέση, πάνω ή κάτω, χρησιμοποιήστε την ιδιότητα CSS κάθετη στοίχιση. Για ένα αντικείμενο για να στοιχίσετε αριστερά ή δεξιά, χρησιμοποιήστε την ιδιότητα CSS float.

Συνιστάται: