Please help!!! Link CSS File Enter your name and the date in the comment section
ID: 3895969 • Letter: P
Question
Please help!!!
Link CSS File
Enter your name and the date in the comment section of ws_jfk.html, ws_media.css, and ws_captions.vtt files respectively.
Open ws_jfk.html file and insert a link to the ws_media.css style sheet file. Take some time to study the content and structure of the document.
Insert Video
Scroll down to the article element and directly below the h1 heading, insert a video clip with the controls enabled, displaying the poster image ws_jfk_poster.png file. Add two possible sources to the video clip: ws_jfk_speech.mp4 and ws_jfk_speech.webm, including the mime-type for each video source.
Captions
After the two video sources, add a captions track with the label Speech Captions using the source file ws_captions.vtt. If the browser does not support embedded video, display the paragraph: To play this video clip, your browser needs to support HTML5 .
Captions File
Open the ws_captions.vtt file and add an initial line to the text file indicating that this file is in WEBVTT format.
Track Cues
Add the following track cues to the ws_captions.vtt file, labeling the captions 1 through 12 (times are in parenthesis):
(00:01.00 - 00:004.000) We observe today
(00:04.000 - 00:06.000) not a victory of party,
(00:06.000 - 00:10.000) but a celebration of freedom – (00:10.000 - 00:12.000) symbolizing an end,
(00:12.000 - 00:15.000) as well as a beginning –
(00:15.000 - 00:17.000) signifying renewal,
(00:17.000 - 00:19.000) as well as change.
(00:19.000 - 00:22.000) For I have sworn before you
(00:22.000 - 00:24.000) and Almighty God
(00:24.000 - 00:27.000) the same solemn oath
(00:27.000 - 00:30.000) our forebears prescribed
(00:30.000 - 00:33.000) nearly a century and three-quarters ago.
Media File
Video Elements
Open the ws_media.css file and within the Video Player Styles section, insert a style rule that displays video elements as blocks with a width of 90% and horizontally centered by setting the top/bottom margins to 5 pixels and the left/right margins to auto.
Media Query
Create a media query for screen devices with a minimum width of 521 pixels. (See Tutorial 5 to review media queries.) Within the media query, create a style for video elements that sets the width of the player to 360 pixels, floated on the right margin with a margin width of 10 pixels.
Track Styles
Within the Track Styles section, create a style rule for caption cues that displays the text in a 1.3em sans-serif font with a text color of rgb(221, 128, 160), and a background color of rgba(255, 255, 255, 0.8).
Wrapping Up
Verify
Open ws_jfk.html file and build your website. Test the page by playing the video clip of Kennedy’s speech. Verify that captions are added to the speech, matching the words uttered by the president.
(Notes : If your captions appear white on a gray background, move the mouse pointer away from the video player so that the video slider is not showing.)
<!DOCTYPE html>
<html lang="en">
<head>
<!--
New Perspectives on HTML5 and CSS3, 7th Edition
Tutorial 8
Case Problem 1
JFK Inaugural Page
Author:
Date:
Filename: ws_jfk.html
-->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Rhetoric in the United States: JFK Inaugural Address (1961)</title>
<link href="ws_base.css" rel="stylesheet" />
<link href="ws_styles.css" rel="stylesheet" />
</head>
<body>
<header>
<img src="ws_logo.png" alt="White Sands College" id="wsimg" />
<img src="ws_rhetoric.png" alt="American Rhetoric" id="logoimg" />
<nav class="horizontal" id="topLinks">
<a id="navicon" href="#"><img src="ws_navicon.png" alt="" /></a>
<ul>
<li><a href="#">Syllabus</a></li>
<li><a href="#">Class Notes</a></li>
<li><a href="#">Readings</a></li>
<li><a href="#">Exams</a></li>
<li><a href="#">Office Hours</a></li>
</ul>
</nav>
<h1>Rhetoric in the United States</h1>
</header>
<section>
<article>
<h1>John F. Kennedy Inaugural Address</h1>
<p>Vice President Johnson, Mr. Speaker, Mr. Chief Justice, President Eisenhower,
Vice President Nixon, President Truman, reverend clergy, fellow citizens:
</p>
<p>We observe today not a victory of party, but a celebration of freedom —
symbolizing an end, as well as a beginning — signifying renewal, as well
as change. For I have sworn before you and Almighty God the same solemn oath
our forebears prescribed nearly a century and three-quarters ago.
</p>
<p>The world is very different now. For man holds in his mortal hands the power to
abolish all forms of human poverty and all forms of human life. And yet the same
revolutionary beliefs for which our forebears fought are still at issue around the
globe — the belief that the rights of man come not from the generosity of
the state, but from the hand of God.</p>
<p>We dare not forget today that we are the heirs of that first revolution. Let
the word go forth from this time and place, to friend and foe alike, that the torch
has been passed to a new generation of Americans — born in this century, tempered
by war, disciplined by a hard and bitter peace, proud of our ancient heritage, and
unwilling to witness or permit the slow undoing of those human rights to which
this nation has always been committed, and to which we are committed today at
home and around the world.</p>
<p>Let every nation know, whether it wishes us well or ill, that we shall pay any price,
bear any burden, meet any hardship, support any friend, oppose any foe, to assure
the survival and the success of liberty.</p>
<p>This much we pledge -- and more.</p>
<p><a href="#">--- continue ---</a></p>
</article>
<aside>
<h1>Rhetorical Elements</h1>
<p>John F. Kennedy's inaugural address drew inspiration from several sources,
including Lincoln's 1865 inaugural speech and the Bible. The speech's structure
evoked the rhetorical idea of <em>kairos</em> indicating <q>a passing instant
of great opportunity and danger.</q>
</p>
<p>Written at a time of heightened anxiety over nuclear proliferation, Kennedy
evoked kairos on the pressing need to resolve the relationship between
duty and power. Kennedy notes:
<q>...Man holds in his mortal hands the power to abolish all forms of human poverty
and all forms of human life.</q> Yet with the power to destroy, also
comes the power to build, and thus Kennedy exhorts his fellow citizens
<q>to bear the burden of a long twilight struggle ... against the common enemies of
man: tyranny, poverty, disease, and war itself.</q>
</p>
<p>The speech also applies the rhetorical concepts of prepon and dynaton.
<q>Prepon</q> is the principle that <q>what is said must conform to
both audience and occasion.</q> <q>Dynaton</q> is the principle that
the goals of the speech are possible and achievable. Thus for Kennedy's
rhetoric to be impactful it had to be presented at the right time, to the right
audience and braced with realistic goals.
</p>
<p>Throughout the speech, Kennedy invokes <em>chiasmus</em>, a rhetorical technique
in which a larger point is expressed by a reversal of the grammatical structure
of two or more related clauses. The most well-known chiasmus in Kennedy's speech
is the oft-quoted <q>Ask not what your country can do for, ask what you can do for
your country.</q> By freely applying chiasmus throughout his speech, Kennedy further
underlines the relationship between duty and power not just between nations, but also
between citizens and their government.
</p>
</aside>
<nav class="vertical">
<h1>Explore Other Speeches</h1>
<ul>
<li><a href="#">Daniel Webster: On the Clay Compromise of 1850</a></li>
<li><a href="#">Abraham Lincoln: Second Inaugural Address</a></li>
<li><a href="#">Abraham Lincoln: Gettysburg Address</a></li>
<li><a href="#">William Jennings Bryant: "Cross of Gold"</a></li>
<li><a href="#">Clarence Darrow: "Mercy for Leopold and Loeb"</a></li>
<li><a href="#">Franklin Roosevelt: Pearl Harbor Address</a></li>
<li><a href="#">Eleanor Roosevelt: The Struggle for Human Rights</a></li>
<li><a href="#">Douglas MacArthur: Farewell Address to Congress</a></li>
<li><a href="#">John Fitzgerald Kennedy: Inaugural Address</a></li>
<li><a href="#">John Fitzgerald Kennedy: "Ich bin ein Berliner"</a></li>
<li><a href="#">Ronald Reagan: "A Time for Choosing"</a></li>
<li><a href="#">Malcolm X: The Ballot or the Bullet</a></li>
<li><a href="#">Martin Luther King, Jr: I Have A Dream</a></li>
<li><a href="#">Martin Luther King, Jr.: "I've Been to the Mountaintop"</a></li>
<li><a href="#">Barbara Jordan: DNC Keynote Address</a></li>
</ul>
</nav>
</section>
<footer>
Rhetoric in the United States © 2018 English (US)
</footer>
</body>
</html>
@charset "utf-8";
/*
New Perspectives on HTML and CSS, 7th Edition
Tutorial 8
Case Problem 1
Rhetoric in the United States Styles for Media
Author:
Date:
Filename: ws_media.css
*/
/* Video Player Styles */
/* Track Styles */
@charset "utf-8";
/*
New Perspectives on HTML and CSS, 7th Edition
Tutorial 8
Case Problem 1
Rhetoric in the United States Styles for Media
Author:
Date:
Filename: ws_media.css
*/
/* Video Player Styles */
/* Track Styles */
@charset "utf-8";
/*
New Perspectives on HTML and CSS, 7th Edition
Tutorial 8
Case Problem 1
Rhetoric in the United States Styles for Media
Author:
Date:
Filename: ws_media.css
*/
/* Video Player Styles */
/* Track Styles */
The ws_captions.vtt file is blank.
white sands college Syllabus Class Notes Readings Exams Office Hours Rhetoric in the United States John F. Kennedy Inaugural Address Rhetorical Elements Vice President Johnson, Mr Speaker, Mr. Chief Justice, President Eisenhower, Vice President Nixon, President Truman, reverend clergy fellow citizens: John F. Kennedy's inaugural address drew inspiration from several sources, including Lincoln's 1865 inaugural speech and the Bible. The speech's structure evoked the rhetorical idea of kairos indicating a passing instant of grat opportumity and danger Written at a time of heightened anxiety over nuclear proliferation, Kennedy evoked kairos on the pressing need to resolve the relationship between duty and power We observe today not a victory of party, but a celebration of freedom_symbolizing an end, as well as a beginning- signifying renewal, as well as change. For I have swonn before you and Almighty God the same solemn oath our y notes:...Man holds in his mortal hands the power to abolish all forms of human poverty and all forms of human life. Yet with the power to destroy, also comes the power to build and thus Kennedy exhorts his fellow citizens to bear the burden of a long twilight struggle of man: tyranny,poverty, disense, and war itself The speech also applies the rhetorical concepts of prepon and dynaton. Prepon is the principle that what is said must We observe toda tinst the COMMO enemies forebears prescribed nearly a century and three-quarters ago. The world is very different now. For man holds in his mortal hands the power to conforn to both audience and occasion. Dynaton is the principle abolish all forms of human poverty and all forms of human life. And yet the same revolutionary beliefs for which our forebears fought are still at issue around Thus for Kennedy's rhetoric to be impactful it had to be the globe-the beliof that the rights of man come not from the generosity of the presented at the right time, to the right audience and braced state, but from the hand of God that the goals of the speech are possible and achievable. th realistic goals. Throughout the speech, Kennedy invokes chiasnus, a We dare not forget today that we are the heirs of that first revolution. Let the word go forth from this time and place, to friend and foe alike, that the torch has rhetorical technique in which a larger point is expressed by a bon passed to a new generation of Americans-born in this oenlun. tempon d neve su thEn nmat 1tructured two ?·more-data by war, disciplined by a hard and bitter peace, proud of our ancient heritage, and clauses. The most well-known chiasmus in Kennedy unwilling to witness or permit the slow undoing of those human rights to which speech is the oft-quoted Ask not what y this nation has always been committed, and to which we are committed today at ask what you can do for your country. By freely applying home and around the world hiasmus throughout his speech, Kennedy further underlines the relationship between duty and power not just between nations, but also between citizens and their Let every nation know, whether it wishes us well or ill, that we shall pay any price, bear any burden, meet any hardship, support any friend, oppose any foe, to assure the survival and the success of liberty This much we pledge- and more continue Explore Other Speeches Daniel Webster On the Clay Compromise of 185 Abraham Lincoln: Second Inaugur all Address Abraham Lincoln: Gettysburg Address William Jennings Bryant: Cross of Gold Clarence Darrow: Mercy for Leopold and Loeb Franklin Roosevelt:Pearl Harbor Address leanoe Reosevelt. The Struggle for Human Rights Douglas MacArthur: Farewell Address to Congress John Fitagerald Kennedy: Inaugural Address John Fitagerald Kemnedy: Tch bin ein Berliner Rhetoric in the United States 9 2018 English (US) Ronald Reagan: "A Time for Choosing Malcolm X: The Ballot oe the Bullet Martin Luther King. Jr: I Have A Dream Martin Luther King. J. Tve een to the Mountaintop Barbara Jordan: DNC Keynote AddressExplanation / Answer
Solved first four points
1. Open ws_jfk.html file and insert a link to the ws_media.css style sheet file.
2. Scroll down to the article element and directly below the h1 heading, insert a video clip with the controls enabled, displaying the poster image ws_jfk_poster.png file. Add two possible sources to the video clip: ws_jfk_speech.mp4 and ws_jfk_speech.webm, including the mime-type for each video source.
3. After the two video sources, add a captions track with the label Speech Captions using the source file ws_captions.vtt. If the browser does not support embedded video, display the paragraph: To play this video clip, your browser needs to support HTML5 .
4. Open the ws_media.css file and within the Video Player Styles section, insert a style rule that displays video elements as blocks with a width of 90% and horizontally centered by setting the top/bottom margins to 5 pixels and the left/right margins to auto.
HTML code:
<!DOCTYPE html>
<html lang="en">
<head>
<!--
New Perspectives on HTML5 and CSS3, 7th Edition
Tutorial 8
Case Problem 1
JFK Inaugural Page
Author:
Date:
Filename: ws_jfk.html
-->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Rhetoric in the United States: JFK Inaugural Address (1961)</title>
<link href="ws_base.css" rel="stylesheet" />
<link href="ws_styles.css" rel="stylesheet" />
<link href="ws_media.css" rel="stylesheet" /> <!--link to media style sheet-->
</head>
<body>
<header>
<img src="ws_logo.png" alt="White Sands College" id="wsimg" />
<img src="ws_rhetoric.png" alt="American Rhetoric" id="logoimg" />
<nav class="horizontal" id="topLinks">
<a id="navicon" href="#"><img src="ws_navicon.png" alt="" /></a>
<ul>
<li><a href="#">Syllabus</a></li>
<li><a href="#">Class Notes</a></li>
<li><a href="#">Readings</a></li>
<li><a href="#">Exams</a></li>
<li><a href="#">Office Hours</a></li>
</ul>
</nav>
<h1>Rhetoric in the United States</h1>
</header>
<section>
<article>
<h1>John F. Kennedy Inaugural Address</h1>
<video controls poster="ws_jfk_poster.png">
<source src="ws_jfk_speech.mp4" type="video/mp4">
<source src="ws_jfk_speech.webm" type="video/webm">
To play this video clip, your browser needs to support HTML5.
<track label="Speech Captions" kind="subtitles" srclang="en" src="ws_captions.vtt" default>
</video>
<p>
Vice President Johnson, Mr. Speaker, Mr. Chief Justice, President Eisenhower,
Vice President Nixon, President Truman, reverend clergy, fellow citizens:
</p>
<p>
We observe today not a victory of party, but a celebration of freedom —
symbolizing an end, as well as a beginning — signifying renewal, as well
as change. For I have sworn before you and Almighty God the same solemn oath
our forebears prescribed nearly a century and three-quarters ago.
</p>
<p>
The world is very different now. For man holds in his mortal hands the power to
abolish all forms of human poverty and all forms of human life. And yet the same
revolutionary beliefs for which our forebears fought are still at issue around the
globe — the belief that the rights of man come not from the generosity of
the state, but from the hand of God.
</p>
<p>
We dare not forget today that we are the heirs of that first revolution. Let
the word go forth from this time and place, to friend and foe alike, that the torch
has been passed to a new generation of Americans — born in this century, tempered
by war, disciplined by a hard and bitter peace, proud of our ancient heritage, and
unwilling to witness or permit the slow undoing of those human rights to which
this nation has always been committed, and to which we are committed today at
home and around the world.
</p>
<p>
Let every nation know, whether it wishes us well or ill, that we shall pay any price,
bear any burden, meet any hardship, support any friend, oppose any foe, to assure
the survival and the success of liberty.
</p>
<p>This much we pledge -- and more.</p>
<p><a href="#">--- continue ---</a></p>
</article>
<aside>
<h1>Rhetorical Elements</h1>
<p>
John F. Kennedy's inaugural address drew inspiration from several sources,
including Lincoln's 1865 inaugural speech and the Bible. The speech's structure
evoked the rhetorical idea of <em>kairos</em> indicating <q>
a passing instant
of great opportunity and danger.
</q>
</p>
<p>
Written at a time of heightened anxiety over nuclear proliferation, Kennedy
evoked kairos on the pressing need to resolve the relationship between
duty and power. Kennedy notes:
<q>
...Man holds in his mortal hands the power to abolish all forms of human poverty
and all forms of human life.
</q> Yet with the power to destroy, also
comes the power to build, and thus Kennedy exhorts his fellow citizens
<q>
to bear the burden of a long twilight struggle ... against the common enemies of
man: tyranny, poverty, disease, and war itself.
</q>
</p>
<p>
The speech also applies the rhetorical concepts of prepon and dynaton.
<q>Prepon</q> is the principle that <q>
what is said must conform to
both audience and occasion.
</q> <q>Dynaton</q> is the principle that
the goals of the speech are possible and achievable. Thus for Kennedy's
rhetoric to be impactful it had to be presented at the right time, to the right
audience and braced with realistic goals.
</p>
<p>
Throughout the speech, Kennedy invokes <em>chiasmus</em>, a rhetorical technique
in which a larger point is expressed by a reversal of the grammatical structure
of two or more related clauses. The most well-known chiasmus in Kennedy's speech
is the oft-quoted <q>
Ask not what your country can do for, ask what you can do for
your country.
</q> By freely applying chiasmus throughout his speech, Kennedy further
underlines the relationship between duty and power not just between nations, but also
between citizens and their government.
</p>
</aside>
<nav class="vertical">
<h1>Explore Other Speeches</h1>
<ul>
<li><a href="#">Daniel Webster: On the Clay Compromise of 1850</a></li>
<li><a href="#">Abraham Lincoln: Second Inaugural Address</a></li>
<li><a href="#">Abraham Lincoln: Gettysburg Address</a></li>
<li><a href="#">William Jennings Bryant: "Cross of Gold"</a></li>
<li><a href="#">Clarence Darrow: "Mercy for Leopold and Loeb"</a></li>
<li><a href="#">Franklin Roosevelt: Pearl Harbor Address</a></li>
<li><a href="#">Eleanor Roosevelt: The Struggle for Human Rights</a></li>
<li><a href="#">Douglas MacArthur: Farewell Address to Congress</a></li>
<li><a href="#">John Fitzgerald Kennedy: Inaugural Address</a></li>
<li><a href="#">John Fitzgerald Kennedy: "Ich bin ein Berliner"</a></li>
<li><a href="#">Ronald Reagan: "A Time for Choosing"</a></li>
<li><a href="#">Malcolm X: The Ballot or the Bullet</a></li>
<li><a href="#">Martin Luther King, Jr: I Have A Dream</a></li>
<li><a href="#">Martin Luther King, Jr.: "I've Been to the Mountaintop"</a></li>
<li><a href="#">Barbara Jordan: DNC Keynote Address</a></li>
</ul>
</nav>
</section>
<footer>
Rhetoric in the United States © 2018 English (US)
</footer>
</body>
</html>
CSS:
@charset "utf-8";
/*
New Perspectives on HTML and CSS, 7th Edition
Tutorial 8
Case Problem 1
Rhetoric in the United States Styles for Media
Author:
Date:
Filename: ws_media.css
*/
/* Video Player Styles */
video {
display: block;
width: 90%;
margin: 5px auto;
}