CSS margin-block ιδιότητα

Definition and Usage

margin-block The attribute specifies the outer margin at the start and end edges of the block direction, which is a shorthand for the following attributes:

margin-block The value of the attribute can be set in different ways:

If the margin-block attribute has two values:

margin-block: 10px 50px;
  • The outer margin of the starting edge is 10px
  • οι περιθώρια στις τελικές κορυφές είναι 50px

Αν η ιδιότητα margin-block έχει μια τιμή:

margin-block: 10px;
  • Οι περιθώρια στις αρχικές και τελικές κορυφές είναι 10px

CSS margin-block και margin-inline ιδιότητες είναι σύμφωνες με margin-top,margin-bottom,margin-left και margin-right Παρόμοια με margin-inline Η ιδιότητα εξαρτάται από τον κατευθυντήριο όρο και τον κατευθυντήριο όρο γραφής.

Σημείωση:σχετικές ιδιότητες CSS writing-mode Ορίζει τον κατευθυντήριο όρο. Αυτό επηρεάζει την αρχική και τελική θέση του τεμαχίου και margin-block Το αποτέλεσμα της ιδιότητας. Για τις σελίδες αγγλικών, ο κατευθυντήριος όρος είναι προς τα κάτω και ο κατευθυντήριος όρος της γραφής είναι από αριστερά προς δεξιά.

Παράδειγμα

Παράδειγμα 1

Ρύθμιση των περιθωρίων στους δύο άξονες του κατευθυντήριου όρου.

div {
  margin-block: 35px;
}

Δοκιμάστε το προσωπικά

Παράδειγμα 2

Όταν το στοιχείο <div> είναι writing-mode Όταν η τιμή του attributes είναι vertical-rl, η αρχική θέση του στοιχείου στο κατευθυντήριο των τεμαχίων μετακινείται από την κορυφή στο δεξί και η τελική θέση του στοιχείου μετακινείται από το κάτω στο αριστερό. Η αλλαγή του writing-mode επηρεάζει επίσης την επίδραση του margin-block:

#parentDiv {
  writing-mode: vertical-rl;
}
#myDiv {
  margin-block: 10px 50px;
}

Δοκιμάστε το προσωπικά

Γλώσσα CSS

margin-block: auto|μήκος|initial|προσαρμογή;

Τιμή ιδιότητας

Τιμή Περιγραφή
αυτόματα Προεπιλεγμένο. Η προεπιλεγμένη τιμή του margin-block του στοιχείου.
μήκος

Καθορισμός του margin-block με μονάδες όπως px, pt, cm. Αποτελούνται από αρνητικές τιμές.

Δείτε:Μονάδες CSS。
% Καθορισμός του ποσοστού της μεγέθυνσης του γονικού στοιχείου στον κατευθυντήριο όρο.
αρχικό Ρύθμιση αυτής της ιδιότητας στην προεπιλεγμένη τιμή. Δείτε αρχικό。
προσαρμογή Απόκτηση αυτής της ιδιότητας από το γονικό στοιχείο. Δείτε προσαρμογή。

Τεχνικές λεπτομέρειες

Προεπιλεγμένο: αυτόματα
Προσαρμογή: Όχι
Κίνησης: Υποστήριξη. Δείτε:Πρότυπα κινήσεων。
Έκδοση: CSS3
Γλώσσα γράψματος: object.style.marginBlock="50px 20px"

Υποστήριξη περιηγητών

Ο αριθμός στην τάβλη δείχνει την έκδοση του προγράμματος περιήγησης που υποστηρίζει πλήρως την ιδιότητα.

Χρωμέ Εντζ Φάιρφξεξ Σάφάρι Όπερα
87.0 87.0 66.0 14.1 73.0

Σχετικές σελίδες

Αναφορά:CSS margin-block-end ιδιότητα

Αναφορά:CSS margin-block-start ιδιότητα

Αναφορά:CSS margin-bottom ιδιότητα

Αναφορά:CSS ένθετο-γραμμή ιδιότητα

Αναφορά:CSS αριστερή-μάρκα ιδιότητα

Αναφορά:CSS δεξιά-μάρκα ιδιότητα

Αναφορά:CSS επάνω-μάρκα ιδιότητα

Αναφορά:CSS writing-mode ιδιότητα