Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

make only one bold letter in a word ionic-angularjs

I would like to know how to set only a specific letter inside a word, in my case the first one, in angularJS. For example, I have an array of words like :

var Words = [Mon,Tue,Wed];

I want to show the first letter of every element bold and the rest of word with normal font.

like image 747
PhiceDev Avatar asked Dec 05 '22 21:12

PhiceDev


1 Answers

Having you first letter bold is purely visual, so it should not be reflected in your HTML but purely managed by CSS. This is important for accessibility and usability of our text, also respect HTML semantics.

CSS is used to suggest its presentation to human users.

There is a property called ::first-letter (:first-letter) which work very well and is very well describe on MDN

The ::first-letter CSS pseudo-element selects the first letter of the first line of a block, if it is not preceded by any other content (such as images or inline tables) on its line.

Here is an exemple of CSS

p:first-letter {
    font-weight: bold;
}

And a JSFiddle to perform some test : http://jsfiddle.net/mtjzsh5v/

Hope this will work for you.

like image 200
sebastienbarbier Avatar answered Dec 08 '22 09:12

sebastienbarbier