CODEWITHSUNDEEP
javascriptcssfontsfont-size
Amit
Amit

Reputation: 22076

How to change FontSize By JavaScript?

This code is not working 

var span = document.getElementById("span");
span.style.fontsize = "25px";
span.innerHTML = "String";


Upvotes: 47

Views: 201003

Answers (6)

Rey
Rey

Reputation: 1

I had the same problem, this was my original HTML:

<input id = "fsize" placeholder = "Font Size" type = "number">
</input>

<button id = "apfsizeid" onclick = "apfsize()"> Apply Font Size 
</button>

<textarea id = "tarea"> Your Text 
</textarea>

And this was my original JS:

function(apfsize) {
var fsize = document.getElementById("fsize").value;
var text = document.getElementById("tarea").innerHTML;
text.style.fontsize = fsize;
document.getElementById("tarea").innerHTML = text;
}

This is my new JS, and it seems to be working just fine:

function apfsize() {
var fsize = document.getElementById("fsize").value;
fsize = Number(fsize);
document.getElementById("tarea").style.fontSize = fsize + "px";
}

So for some reason, I had to add the little "px" at the very last as a string, and somehow it worked. I hope this helps :)

Upvotes: 0

Ankush Sood
Ankush Sood

Reputation: 181

span.style.fontSize = "25px";

use this

Upvotes: 0

tibalt
tibalt

Reputation: 16164

Please never do this in real projects😅:

document.getElementById("span").innerHTML = "String".fontsize(25);
<span id="span"></span>

Upvotes: 1

Mark
Mark

Reputation: 234

<span id="span">HOI</span>
<script>
   var span = document.getElementById("span");
   console.log(span);

   span.style.fontSize = "25px";
   span.innerHTML = "String";
</script>

You have two errors in your code:

  1. document.getElementById - This retrieves the element with an Id that is "span", you did not specify an id on the span-element.

  2. Capitals in Javascript - Also you forgot the capital of Size.

Upvotes: 10

Naftali
Naftali

Reputation: 146300

try this:

var span = document.getElementById("span");
span.style.fontSize = "25px";
span.innerHTML = "String";

Upvotes: 4

ambiguousmouse
ambiguousmouse

Reputation: 2063

JavaScript is case sensitive.

So, if you want to change the font size, you have to go:

span.style.fontSize = "25px";

Upvotes: 86

Related Questions