2016-05-12 10 views
0

Ich verwende eines der im Lieferumfang enthaltenen KendoUI Themen, aber ich möchte die Schriftfamilie ersetzen. Was ist der einfachste Weg, um die gesamte Schriftfamilie der Kendo UI zu überschreiben?Wie ändert man die Standard-Kendo-UI-Schriftart?

+0

Haben Sie versucht, ein Stylesheet zu erstellen Kendos Schriftarten überschreiben? – DontVoteMeDown

+0

Ich habe es versucht, aber ich denke, ich frage, welcher Selektor oder wie man den Standard setzt, damit ich nicht jedes Element stylen muss. –

+0

Chrome Developer Tools sind dafür von unschätzbarem Wert. Sehen Sie sich die Seite an und sehen Sie, welche Quelle die Schriftart ist. Sie können beginnen, indem Sie einfach das -Tag überschreiben. –

Antwort

0

In Angular können Sie die neue Schriftart vorhanden Sie verwenden unter

$scope.$on("kendoWidgetCreated", function (event, widget) { 
     var styleTag = widget.body.parentNode.getElementsByTagName("style")[0]; 
     styleTag.parentNode.removeChild(styleTag); 
     widget.body.style.fontFamily = '<your font name here>'; 
     widget.body.style.fontSize = '12px'; 
     widget.body.style.color = '#35384D'; 
}); 

Stellen Sie sicher, tun in Kendo-Schriften zur Verfügung gestellt, wenn es nicht vorhanden ist, wird Kendo Standard-Schriftart Arial verwenden.

Um einen anderen Third-Party-Font zu verwenden, muss dieser im Kendo-Header-Abschnitt enthalten sein. Ich kämpfe im Moment mit google font in Kendo, werde aber den Thread aktualisieren, wenn ich ein Beispiel bekomme.

Schließlich muss ich für hässliche Lösung gehen tun google Schriftart verwenden, obwohl Kendo Demo viel einfacher Art und Weise zeigen, es zu tun, aber die waren nicht für mich arbeiten

angular.element(angular.element('.k-editable-area .k-content')[0].contentDocument.getElementsByTagName("head")) 
       .append("<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,600' rel='stylesheet' type='text/css'>"); 
Verwandte Themen