This forum is now read-only. Please use our new forums! Go to forums
SPAN
Below is the hint for the lesson. After Arial, there is a semi- colon ;
<p>My name is <span style="font-family: Arial;">Leng</span>!</p>
I did not type a semi-colon into my answer ( No semi-colon after IMPACT) yet was accepted.
<p>My favorite font is <span style="font-family: Impact">Impact</span>!</p>
So is the semi-colon required? Is it optional - if so, that will get confusing. Can anyone speak to this?
Answer 55cd3d7ad3292f10d1000848
You’ll need the semi-colon for applying multiple styles in a style sheet or inline styling, but if it’s just one style being added, the code works fine without a semi-colon.
For instance, the below will not change the font or color of h1 without the semi-colons.
h1 {
font-family:Arial;
color:red;
}
<h1 style="font-family:arial; color:red">Hello</h1>
but
<h1 style="font-size: 30px"> Hello2 </h1>
h1 {
color:red
}
work fine. Personally, I would default to using it if it confuses you. This way, you don’t forget it when it is necessary.
Answer 55d2872f9376763cc100043f
++++++++ don’t know how to use STYLE attribute ++++
<!DOCTYPE html>
<html>
<head>
<title>First font size change</title>
</head>
<body>
<p style = "font-size:8px"> Some text for you to make tiny! </p>
<p style = "font-size:10px ; background-color: blue"> Some text for you to make normal size!</p>
<p style = "font-size:18px> Some text for you to make super big!</p>
</body>
</html>
You see the HTML-page, with a HEADER characterised by the HEAD-Tags <header></head> with a BODY characterised by the BODY-Tags <body></body>
within the BODY you have 3 PARAGRAPH-Tags <p></p>
Within the opening-Tag of a HTML-Element like the p-Tag you can insert so-called attributes.
One of those attributes is the style-attribute with which you can manipulate the display-style of a HTML-Element.
Now we run into the usage of the word property Each property consists of a property-key and it’s associated VALUE If you have more then one property you use the semi-colon-; as separator
The syntax of writing a property is the property-key a colon and it’s associated VALUE thus the font-size-property would look like: font-size: 12px
As the font-size is a property of the style-attribute we would write style = “font-size: 12px” or ( with multiple properties ) style = “font-size:12px ; background-color: blue” we are using the semi-colon-; as a so-called separator
We now integrate this into the starting <p>-Tag <p style = “font-size:12px ; background-color: blue” ></p> The -background-color of this p-Tag will be blue and the characters of the TEXT which we write in-between the p-Tags will have a font-size of 12 pixels.
Some reference-material: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes
Answer 55d28747e39efe2c960001e6
++ general search Did you try… http://www.codecademy.com/guidance/choose
google search == the Book == jquery [your question] site:developer.mozilla.org CSS [your question] site:developer.mozilla.org javascript [your question] site:developer.mozilla.org [your question] site:jquery.com [your question] site:getbootstrap.com
== discussions / opinions == jquery [your question] site:stackoverflow.com CSS [your question] site:stackoverflow.com javascript [your question] site:stackoverflow.com
== guidance == www.crockford.com [your question] site:crockford.com
http://stackoverflow.com/questions/1795438/load-and-execution-sequence-of-a-web-page https://learn.jquery.com/events/event-delegation/
https://developer.mozilla.org/en-US/Learn/HTML/HTML_tags https://developer.mozilla.org/en-US/docs/Web/CSS/Reference https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes http://www.w3schools.com/jquery/jquery_ref_selectors.asp
Popular free courses
- Free Course
Learn SQL
In this SQL course, you'll learn how to manage large datasets and analyze real data using the standard data management language.Beginner friendly,4 LessonsLanguage Fluency - Free Course
Learn JavaScript
Learn how to use JavaScript — a powerful and flexible programming language for adding website interactivity.Beginner friendly,11 LessonsLanguage Fluency - Free Course
Learn HTML
Start at the beginning by learning HTML basics — an important foundation for building and editing web pages.Beginner friendly,6 LessonsLanguage Fluency
1 comments
Thanks for your reply. I understood using it for multiple styles - that was pretty clear in the lesson. It was confusing to see it used in the hint when only one style was shown.