ZuoTi.Pro
Question

|HTML 460 HTML Chapter 9 Integrating Audio and Video In the Labs Labs 1 and 2, which increase in difficulty, require you to cIntegrating Audio and Video HTML Chapter 9 HTML 461 7. In the fbstyles.css file, update the comment with todays date, and th

|HTML 460 HTML Chapter 9 Integrating Audio and Video In the Labs Labs 1 and 2, which increase in difficulty, require you to create webpages based on what you learned in the chapter; Lab 3 requires you to dive deeper into a topic covered in the chapter. Lab 1: Adding Video to the New Harvest Food Bank Website Problem: You volunteer at a local food bank called New Harvest Food Bank that collects community food donations and provides food and other services created a responsive website but now need to add a video to the home page to attract volunteers. You also need to format the video on the page. Create and style the video as shown in Figure 9-27 those in need. You have already V OML CU N TE E R T le a l ued met acdWec g tho b yar e Figure 9-27 Instructions: Perform the following tasks: 1. Save the labl\media folder from the Data Files for Students to your labl folder. 2. Open your text editor and then open the index.html document in the labl folder and update the comment at the top of the page to include today's date. 3. In the main element of the index.html document, insert a video element with autoplay and controls attributes. 4. Specify the following three source files within the type attribute and value for each source. srcmedia/volunteer.mp4 srcmedia/volunteer.ogg srcmedia/volunteer. webm video clement and insert the appropriate 5, Create a paragraph element below the source elements with text that states Your brows er does not support the video element. div clement and include a class= "video" attribute and 6. Wrap the video element in a value. STUDENT ASSIGNMENTS
Integrating Audio and Video HTML Chapter 9 HTML 461 7. In the fbstyles.css file, update the comment with today's date, and then create the following new style rules above the media queries and include comments for each: .video text-align: center: padding: 1em; video border: 0.2em solid #FF6600 ; height: auto max-width: 100% } 8. Save all files, open the index.html page within a browser, and then view the page, as shown in Figure 9-27 9. Validate your HTML code and fix any errors. 10. Validate your CSS code and fix any errors 11. Submit your assignment in the format specified by your instructor 12.In this assignment, you wrapped a video element within a div element. Could the video element be wrapped within an HTML5 semantic element, such as an a section? Why or why not? article, aside, or C ASSIGNMENTS HTML Chapter 9
engineering   Computer-Science   
0 0
Add a comment Improve this question Transcribed image text
Next > < Previous
Sort answers by oldest

Homework Answers

Answer #1

#source code:


apply.html

<!date:15-6-2019>
<html>
<head>
<title>audiofile</title>
<link rel="stylesheet" href="basic.css">
<style>

</style>
<head>
<body bgcolor="white">
<div id="Sub">
<video controls autoplay loop>
<source src="2.mp4" type="video/mp4">
<source src="2.ogg" type="video/ogg">
<source src="2.webm" type="video/webm">
your browser not suppor to play the video

</video>
<p id="sample">
welcome to volunter work write text here
</p>

</div>


</body>
</html>

#basic.css

#sub{
width:70%;
height:90%;
position:relative;
top:20px;
left:170px;
background-color:white;
border:1px solid black;
border-radius:5%;
}
video{
border:0.2em solid #FF6600;
height:70%;
width:90%;
position:relative;
left:50px;
}
#sample{
text-align:center;
}

#output:

File C:/Users/vishnu/Desktop/apply09.html welcome to volunter work write text here Tyne here to search G 0dal ENG

#if you have any doubts comment below...

0 0
Add a comment
Know the answer?
Add Answer to:
|HTML 460 HTML Chapter 9 Integrating Audio and Video In the Labs Labs 1 and 2,...
Your Answer:

Post as a guest

Your Name:

What's your source?

Earn Coins

Coins can be redeemed for fabulous gifts.

Log In

Sign Up

Not the answer you're looking for? Ask your own homework help question. Our experts will answer your question WITHIN MINUTES for Free.
Similar Homework Help Questions

  • n the Labs Labs 1 and 2, which increase in difficulty, require you to create webpages based on what you learned in the...

    n the Labs Labs 1 and 2, which increase in difficulty, require you to create webpages based on what you learned in the chapter; Lab 3 requires you to dive deeper into a topic covered in the chapter. Lab 1: Creating an External Style Sheet for City Farmer Problem: You work for a local but rapidly growing gardening supply company called City Farmer that specializes in products that support food self-sufficiency. The company has hired you to help create the...

  • 2 Apply Your Knowledge Reinforce the skills and apply the concepts you learned in this chapter Styling a Webpage Instru...

    2 Apply Your Knowledge Reinforce the skills and apply the concepts you learned in this chapter Styling a Webpage Instructions: In this exercise, you will use your text editor to create external, embedded, and inline styles for the Durango Jewelry and Gem Shop home page. You will style the sections of the semantic wireframe header, nav, main, and tooter and a div element that surrounds all of the content to center the content on the page. You will also float...

  • HTML 500 HTML Chapter 10 Creating Interactivity with Social Media and JavaScript In the Labs Labs...

    HTML 500 HTML Chapter 10 Creating Interactivity with Social Media and JavaScript In the Labs Labs 1 and 2, which increase in difficulty, require you to create webpages based on what you learned in the chapter; Lab 3 requires you to dive deeper into a topic covered in the chapter. Lab 1: Determining the Best Social Media Outlets for the New Harvest Food Bank Website You voluntcer at a local food bank called New Harvest Food Bank that collects commu-...

  • Kindly assist in fixing the error i got when I pasted my codes to validate it....

    Kindly assist in fixing the error i got when I pasted my codes to validate it. The error is in bold. Error: Table column 2 established by element th has no cells beginning in it. From line 53, column 25; to line 55, column 40 <tr> <th colspan="2"> <!DOCTYPE HTML> <html lang="en"><!-- language is English-->    <head>    <meta charset="utf-8"/>    <title>DA Website</title>    <link rel="stylesheet" type="text/css" href="styles.css" />    </head>    <body>    <div id="wrapper">    <!-- start html...

  • Task 3: Creating a Simple jQuery Application 1. Launch HTML-Kit. 2. Create a new HTML file...

    Task 3: Creating a Simple jQuery Application 1. Launch HTML-Kit. 2. Create a new HTML file and save it as nnLab8.htm. 3. Add the following HTML to the file: <!DOCTYPE HTML> <html> <head> <title>Hello World - jQuery Style</title> </head> <body> <div id="first"></div> <div id="second"></div> <a href="#" id="link">Click Me!</a><br /> <span id="greeting"></span> </body> </html> 4. Add the following<script> element to the<head> section. NOTE: Use the jQuery version number that matches the file name of the file you downloaded in Step 1....

  • You've been hired to create a website for Eating Well in Season, a business in Glover,...

    You've been hired to create a website for Eating Well in Season, a business in Glover, Vermont, that delivers produce from local farms to its customers. Another team member has created a style sheet for the site but has been unable to resolve some errors in the code. You continue your work on the site by linking to and debugging the style sheet, incorporating a color scheme, and aligning the page content. index.html <!DOCTYPE html> <html lang="en"> <head> <title>Eating Well...

  • I'm need help in the Pacific Trails section of the assignment. I posted my chapter 2...

    I'm need help in the Pacific Trails section of the assignment. I posted my chapter 2 assignment on the bottom of the picture. I'm using Notepad++. This was the previous assignment: CHAPTER 2 ASSIGMENT paste the first content to index.html file and second to yurts.html. First: (index.html contents are below) <!DOCTYPE html> <head> <title>Pacific Trails Resorts</title> </head> <style> a{    padding-right:14px; /* padding anchor tage to right 15px for nav menu */ } </style> <body> <header> <h1>Pacific Trails Resort</h1>   ...

  • Website Case Study 59 JavaJam Coffee Hous Home Dobs Gear avaJam Gear Jnva)am Shirt Figure 12.6 Ne...

    JavaJam Gear Page We were unable to transcribe this imageWebsite Case Study 59 JavaJam Coffee Hous Home Dobs Gear avaJam Gear Jnva)am Shirt Figure 12.6 New JavaJam Gear page Task 4: Create the New Gear Page. One way to be productive is to create pages based on earlier work. Launch a text editor and cpen the Music page (music.html). Save the file your as gearhtml. This will give you a head start and ensure that the pages on the website...

  • URGENT HELP NEEDED: JQuery. PLEASE POST SCREEN SHOTS Task 1: Downloading jQuery Right-click the link to...

    URGENT HELP NEEDED: JQuery. PLEASE POST SCREEN SHOTS Task 1: Downloading jQuery Right-click the link to download the uncompressed latest version of jQuery Copy the jQuery.x.x.x.js file in the folder and specified as source file. Task 2: Download and install HTML-Kit 1. Navigate to htmlkit.com. 2. Click Download HTML-Kit 292. After it downloads, launch HKSetup.exe. Choose Full installation (the default) Uncheck Yes, download and install HTML-Kit Tools Trial. 6. Click Next>Finish. Task 3: Creating a Simple jQuery Application Launch HTML-Kit....

  • Question 1 To remove the underlining from an <a> element, you can use CSS to set...

    Question 1 To remove the underlining from an <a> element, you can use CSS to set its A. text-decoration property to none B. text-decoration property to off C. underline property to none D underline property to off Question 2 You can use the CSS list-style-type property to change A. the bullet style in an unordered list B the number style in an ordered list C the terms style in a description list Dthe bullet or number style in an unordered...

ADVERTISEMENT
Free Homework Help App
Download From Google Play
Scan Your Homework
to Get Instant Free Answers
Need Online Homework Help?
Ask a Question
Get Answers For Free
Most questions answered within 3 hours.
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT