CSS inset-block-end attribute

Ορισμός και χρήση

inset-block-end ιδιότητες για να καθοριστεί η απόσταση από το τέλος του στοιχείου στη κατεύθυνση του τομέα από το γονικό στοιχείο.

Σημείωση:Για να λειτουργήσει αυτή η ιδιότητα, πρέπει να καθοριστεί θεματολογία CSS

CSS inset-inline και inset-block ιδιότητες είναι παρόμοιες με πάνω,κάτω,αριστερά και δεξιά ιδιότητες είναι πολύ παρόμοιες, αλλά inset-block και inset-inline Η ιδιότητα εξαρτάται από την κατεύθυνση του τομέα και της γραμμής.

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

Παράδειγμα

Παράδειγμα 1

Ρυθμίστε την απόσταση του τομέα από το τέλος του στοιχείου <div> στο γονικό στοιχείο κατά την κατεύθυνση του τομέα:

div {
  inset-block-end: 50px;
}

Προσπαθήστε να το δοκιμάσετε!

Παράδειγμα 2

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

div {
  inset-block-end: 50px;
  writing-mode: vertical-rl;
}

Προσπαθήστε να το δοκιμάσετε!

Γλώσσα CSS

inset-block-end: αυτόματα|μήκος|initial|κληρονομικότητα;

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

Τιμή Περιγραφή
αυτόματα Προεπιλεγμένη τιμή. Η προεπιλεγμένη απόσταση εισαγωγής του στοιχείου.
μήκος Διατηρείται η απόσταση με μονάδες όπως px, pt, cm κ.λπ. Επιτρέπονται αρνητικές τιμές. Δείτε:CSS 单位.
% Διατηρείται το ποσοστό απόστασης από το μέγεθος του γονικού στοιχείου κατά την αντίστοιχη άξονα.
initial Ρυθμίστε αυτήν την ιδιότητα στη προεπιλεγμένη της τιμή. Δείτε: initial.
κληρονομικότητα Κληρονομείται αυτή η ιδιότητα από το γονικό στοιχείο. Δείτε: κληρονομικότητα.

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

Προεπιλεγμένη τιμή: αυτόματα
Κληρονομικότητα: Όχι
Κίνηση: Υποστηρίζεται. Δείτε:Ιδιότητες κίνησης.
Έκδοση: CSS3
Γλώσσα προγραμματισμού: object.style.insetBlockEnd="100px"

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

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

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

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

Εκμάθηση:CSS Καθορισμός

Αναφορά:CSS position ιδιότητα

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