Πρότυπο CSS border-top-left-radius

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

Η ιδιότητα border-top-left-radius ορίζει τη μορφή της γωνιακής καμπύλης στο επάνω αριστερό μέρος του περιγράμματος.

Συμβουλή:Η ιδιότητα αυτή επιτρέπει την προσθήκη γωνιακής καμπύλης στο στοιχείο.

Δείτε επίσης:

Εκμάθηση CSS3:CSS3 όρια

Παράδειγμα

Προσθέτει γωνιακή καμπύλη στο επάνω αριστερό μέρος του στοιχείου div:

div
{
border:2px solid;
border-top-left-radius:2em;
}

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

Γλωσσική δομή του CSS

border-bottom-right-radius: length|% [length|%];

Σημειώσεις:Η τιμή της ιδιότητας border-top-left-radius και το ποσοστό ορίζουν τον ρadius του τετράγωνου ελλειψίδου (ορίζει τη μορφή του κορμού της εξωτερικής περιγράμματος γωνίας). Ο πρώτος αριθμός είναι ο οριζόντιος ρadius, ο δεύτερος ο κάθετος ρadius. Αν παραλειφθεί ο δεύτερος αριθμός, θα αντιγραφεί ο πρώτος. Αν η διάρκεια είναι μηδέν, η γωνία θα είναι τετράγωνη αντί για γυροδέντηρη. Το ποσοστό του οριζόντιου ρadius αναφέρεται στη διάρκεια του πλαισίου περιγράμματος, ενώ το ποσοστό του κάθετου ρadius αναφέρεται στη διάρκεια του πλαισίου περιγράμματος.

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

Τιμή Περιγραφή Έλεγχος
length Ορίζει τη μορφή του κάτω αριστερού γωνιακού σημείου. Έλεγχος
% Ορίζει τη μορφή του κάτω αριστερού γωνιακού σημείου με ποσοστό. Έλεγχος

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

Προεπιλεγμένη τιμή: 0
Ανακρίβεια: όχι
Έκδοση: CSS3
Γλωσσική δομή του JavaScript: object.style.borderTopLeftRadius="5px"

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

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

Chrome IE / Edge Firefox Safari Opera
5.0
4.0 -webkit-
9.0 4.0
3.0 -moz-
5.0
3.1 -webkit-
10.5