Η ιδιότητα textBaseline του Canvas

Εγχειρίδιο Canvas

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

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

Η παρακάτω εικόνα δείχνει τις διαφορετικές βάσεις γραμμής που υποστηρίζει η ιδιότητα textBaseline:

文本基线图示

Σημείωση:fillText() ή strokeText() Η μέθοδος προσδιορισμού του κειμένου στην επιφάνεια του καμβά θα χρησιμοποιήσει την καθορισμένη τιμή textBaseline.

Παράδειγμα

Ορισμός ορθογώνιου με μπλε χρώμα:

Ο περιηγητής σας δεν υποστηρίζει το ετικέτα canvas.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
//Σketάστε μια μπλε γραμμή στην τοποθεσία y=100
ctx.strokeStyle="μπλε";
ctx.moveTo(5,100);
ctx.lineTo(395,100);
ctx.stroke();
ctx.font="20px Arial"
//Τοποθετήστε κάθε λέξη με διαφορετική τιμή textBaseline στο y=200
ctx.textBaseline="πάνω";
ctx.fillText("Πάνω",5,100);
ctx.textBaseline="κάτω";
ctx.fillText("Κάτω",50,100);
ctx.textBaseline="κέντρο";
ctx.fillText("Κέντρο",120,100);
ctx.textBaseline="αλφαβητικός";
ctx.fillText("Αλφαβητικός",190,100);
ctx.textBaseline="κρεμαστή";
ctx.fillText("Κρεμαστή",290,100);

Προσπαθήστε το προσωπικά

Γλωσσική δομή

κείμενο.textBaseline="αλφαβητικός|πάνω|κρεμαστή|κέντρο|σημασιολογικός|κάτω";

Τιμή του χαρακτηριστικού

Τιμή Περιγραφή
αλφαβητικός Προεπιλεγμένο. Η γραμμή βασισμένη στο κείμενο είναι η κανονική γραμμή των γράμματος.
πάνω Η γραμμή βασισμένη στο κείμενο είναι το πάνω μέρος του ορθογώνιου em.
κρεμαστή Η γραμμή βασισμένη στο κείμενο είναι η κρεμαστή γραμμή.
κέντρο Η γραμμή βασισμένη στο κείμενο είναι το κέντρο του ορθογώνιου em.
σημασιολογικός Η γραμμή βασισμένη στο κείμενο είναι η γραμμή σημασιολογικής βάσης.
κάτω Η γραμμή βασισμένη στο κείμενο είναι το κάτω μέρος του ορθογώνιου em.

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

Προεπιλεγμένη τιμή： αλφαβητικός

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

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

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

Σημείωση:O Internet Explorer 8 και οι προηγούμενες εκδόσεις δεν υποστηρίζουν το στοιχείο <canvas>.

Εγχειρίδιο Canvas