CSS inset-inline-start ιδιότητα

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

inset-inline-start ορίζει την απόσταση της αρχής του στοιχείου από το γονικό στοιχείο στη κατεύθυνση γραφής.

Σημείωση:Για να γίνει ο χαρακτηριστικός ενεργός, πρέπει να καθοριστεί position χαρακτηριστικά.

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

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

Παράδειγμα

Παράδειγμα 1

Ρύθμιση της απόστασης μεταξύ της αρχής του τοποθετημένου στοιχείου και του γονικού στοιχείου στη κατεύθυνση γραφής:

div {
  inset-inline-start: 50px;
}

Προσπαθήστε το شخصικά

Παράδειγμα 2

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

div {
  inset-inline-start: 50px;
  writing-mode: vertical-rl;
}

Προσπαθήστε το شخصικά

Παράδειγμα 3

Όταν η τιμή του χαρακτηριστικού direction Όταν η τιμή του χαρακτηριστικού είναι rtl, η κατεύθυνση γραφής είναι από δεξιά προς τα αριστερά. Η περιγραφή έχει μικρή λάθος, θα πρέπει να είναι "το αποτέλεσμα είναι ότι η αρχή του στοιχείου παραμένει στη δεξιά πλευρά (γιατί για rtl, η αρχή είναι στη δεξιά πλευρά, αλλά σε σχέση με την προεπιλεγμένη διάταξη ltr, ολόκληρο το περιεχόμενο αναστρέφεται)".

div {
  inset-inline-start: 50px;
  direction: rtl;
}

Προσπαθήστε το شخصικά

Γλώσσα γραφήματος CSS

inset-inline-start: auto|length|initial|εκληρονομικότητα;

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

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

Υποστήριξη του προγράμματος περιήγησης

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

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

Εκμάθηση:CSS Τοποθέτηση

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

Αναφορά:Η ιδιότητα direction του CSS

Αναφορά:CSS writing-mode 属性