font-family & line-height
This sentence within a <h3> tag is great as it is, but should be set in a font list that begins with Helvetica.
This paragraph should appear in Georgia with a line height of 1.8em. Solemnly he came forward and mounted the round gunrest. He faced about and blessed gravely thrice the tower, the surrounding land and the awaking mountains. Then, catching sight of Stephen Dedalus, he bent towards him and made rapid crosses in the air, gurgling in his throat and shaking his head. Stephen Dedalus, displeased and sleepy, leaned his arms on the top of the staircase and looked coldly at the shaking gurgling face that blessed him, equine in its length, and at the light untonsured hair, grained and hued like pale oak.
font-weight
Write a selector and rule that makes this sentence bold (800-weight).
Write a selector and rule that changes this bold text to normal weight (400).
font-style
Write a selector and rule that makes this sentence italic.
Write a selector and rule that changes just this italic text to normal style.
font
Using just one font: property declaration, change this paragraph of text to be set in Georgia, with a font-size of 1.2em and a line height of 1.6em. He peered sideways up and gave a long slow whistle of call, then paused awhile in rapt attention, his even white teeth glistening here and there with gold points. Chrysostomos. Two strong shrill whistles answered through the calm.
text-decoration
Use the text-decoration property to underline this entire sentence.
Use the text-decoration property to remove the underline from just this link and change its color to orange (Beaver orange, of course).
text-align
Align this awesome sentence to the right of the column. The quick brown fox jumped over the broken fence.
Align this awesome sentence to the center of the column. The slow green turtle did not jump over the white fence.
Google Fonts
Using just one font: property declaration AND Google Fonts, change this and the following paragraph of text to be set in Pacifico (from Google Fonts), with a font-size of 1.4em and a line height of 1.6em. You will need to add the required Google Fonts HTML code to the <head> area of this document.
He peered sideways up and gave a long slow whistle of call, then paused awhile in rapt attention, his even white teeth glistening here and there with gold points. Chrysostomos. Two strong shrill whistles answered through the calm.
text-indent
Indent just the first line of the paragraphs in this section by 2em.
He skipped off the gunrest and looked gravely at his watcher, gathering about his legs the loose folds of his gown. The plump shadowed face and sullen oval jowl recalled a prelate, patron of arts in the middle ages. A pleasant smile broke quietly over his lips.
He pointed his finger in friendly jest and went over to the parapet, laughing to himself. Stephen Dedalus stepped up, followed him wearily halfway and sat down on the edge of the gunrest, watching him still as he propped his mirror on the parapet, dipped the brush in the bowl and lathered cheeks and neck.
text-transform
This sentence should be all uppercase
THIS SENTENCE SHOULD BE ALL LOWERCASE
this sentence should have the first letters of each word in uppercase.
Make this sentence all uppercase, but this bold text should be normal case.
white-space
Change the appearance of the code below so that the source formatting applied is displayed. Do NOT used the example CSS below for formatting—is is just sample code.
event.preventDefault();
$.post( "student_login.php", $( "#sl" ).serialize(), function( data ) {
var result = data;
if ( result ) {
var theForm = document.getElementById('studentLogin');
theForm.action = result;
theForm.submit();
} else {
$( "#out" ).html( "<span class='alert'>Password incorrect!</span>");
rotateLogin(rot);
rot+= 10;
if ( rot >= 60 ) {
byebye();
}
}
});
text-shadow
Apply this property to this line of text: text-shadow: 3px 3px 3px rgba(0,0,0,.6);
letter-spacing
Add .3em of spacing between the letters in this sentence.
Remove .2em of spacing between these letters.
list-style-type
- This is a bulleted list, but there is no styling on it.
- Add back the bullet using list-style-type
- Indent the entire list by adding margin to the left of the <li>
- Add some vertical space between list items using margin on the bottom.
- Finally, add a light grey border to the bottom of each item.
- All formatting should be applied to the <li> items.