Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialLearning coding
Front End Web Development Techdegree Student 9,937 PointsSo the text the html inserts inherits the formatting from the page and where it is place in it?
However, when they're added to the document, the browser converts it to 3:57 HTML and applies any formatting at that other paragraph's on the page receive.
1 Answer
Adrien Contee
4,875 PointsYes. That is correct. The reason Dave's text on the screen doesn't look like default formatting is because its inheriting formatting from his linked CSS document.
Here's an example:
CSS:
p {
font-size: 1.5em;
font-family: sans-serif;
color: tomato;
}
/*Here's some paragraph formatting that I've placed in a file named "cool-styles.css"*/
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link type="text/css" rel="stylesheet" href="cool-styles.css">
<!-- Here's my linked stylesheet -->
<title>Cool Website Name Here</title>
</head>
<body>
<div id="someDIV"></div>
<body>
</html>
JS:
function print(message){
var output = document.getElementById("someDiv");
output.innerHTML = message;
}
var html = "";
html += "<p>Look Ma, dyna,ic html from a javascript document</p>"; //Although JS just sees this as random characters.
html += "<p>What's cool is how I inherit the same styles as they do</p>";
print(html);
//When added to the html document, the document sees those angle brackets and converts whatevers inside to html. Regardless of where it came from! And since all the html document sees is html, it also gives them styling from the linked css file
Hope this helps. Good Luck!
How about an upvote for all this typing. ;)