Computer Networking: A Top-Down Approach (7th Edition)
7th Edition
ISBN: 9780133594140
Author: James Kurose, Keith Ross
Publisher: PEARSON
expand_more
expand_more
format_list_bulleted
Related questions
Question
index.html:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="./styles/colors1.css">
<link rel="stylesheet" href="./styles/formatting1.css">
<link rel="stylesheet" href="./styles/transitions-animations1.css">
</head>
<body>
<!--Added main tag-->
<main>
<!--Added nav tag-->
<nav>
<a href="index.html">Home</a>
<a href="contact.html">Contact</a>
<a href="about.html">About</a>
</nav>
<h1>Welcome to my (about me) site</h1>
<picture>
<source media="(min-width:650px)" srcset="./images/me3-650.jpg">
<source media="(min-width:465px)" srcset="./images/me3-465.jpg">
<img src="./images/me3.JPG" alt="ME" style="width:auto;">
</picture>
<h3>HI there this is one of my favorite songs down below.</h3>
<iframe width="420" height="345"
src="https://www.bing.com/search?q=Nirvana%20-%20The%20Man%20Who%20Sold%20The %20World&pc=0TTE&ptag=C1N2A04173C0C08&form=CONBNT&conlogo=CT3210127&shtp=GetUrl&shid=38702244-8c35-477e-a042- 805b2b2d81bc&shtk=TmlydmFuYSAtIFRoZSBNYW4gV2hvIFNvbGQgVGhlIFdvcmxkIChNVFYgVW5wbHVnZ2VkKQ%3D %3D&shdk=UkVNQVNURVJFRCBJTiBIRCEgVGFrZW4gZnJvbSB0aGUgMjV0aCBBbm5pdmVyc2FyeSBFZGl0aW9ucyBvZiBOaXJ2YW5hIGI%3D&shhk=7xVtP%2FaZHQw%2B31lGYV%2F3cJukwLOZgUcFMDTYwdmuLsA %3D&shth=OVP.2ZxeDKLNemtX7dQ99X3ETQHgFo">
</iframe>
<footer>
<div class="foot">
<p>Author: Josiah McSweeney<br>
<p>Copyright Reserved</p>
</div>
</footer>
</main>
</body>
</html>
Transcribed Image Text:The CSS Requirements
Separate your style sheets into three files:
o Istyles/colors.css
o Istyles/formatting.css
o Istyles/transitions-animations.css
Create three breakpoints using media queries in at least one style sheet to
alter the way your website looks on small, medium, and large devices
o it will help to view your current website on a mobile device and
document what looks broken (overflow, small text, etc)
o start coding media queries after identifying elements of your
website that need responsive behavior
Minimum of 25 unique CsS selectors (total across all 3 style sheets
together). Your selectors must satisfy the requirements below:
• 1x Universal Selector
o >= 1 x Type Selector
o >= 1 x Class Selector
>= 1 x ID Selector
>= 1 x Group Selector (ex: h1, p, a {/*styles here*/})
= 2 x Child Selector
= 2 x General Sibling Combinator (-)
• >= 2 x Adjacent Sibling Combinator (+)
o >= 2 x Pseudo Class Selector (ex: nth-of-type )
>ニ
There must be at least one Grid layout and one Flex layout on your website
o Grid style requirements:
- grid-template-areas
1 grid-template-columns
1 grid-template-rows
grid-area
o Flex style requirements:
flex-direction (can be set to row our column)
. flex-wrap
flex-basis
flex-grow - you must have one item that grows more than
other flex items given available space!
. flex-shrink - you must have one item that shrinks more
than other flex items given available space!
• Create at least one transition on the page
Expert Solution
This question has been solved!
Explore an expertly crafted, step-by-step solution for a thorough understanding of key concepts.
Step by stepSolved in 2 steps
Knowledge Booster
Similar questions
- what I have so far please help with what you can <!DOCTYPE html><html> <head> <title>Home Page</title> <link rel="stylesheet" type="text/css" href="./styles/colors1.css"> </head> <body> <!--Added main tag--> <main> <!--Added nav tag--> <nav> <a href="index.html">Home</a> <a href="contact.html">Contact</a> <a href="about.html">About</a> </nav> <h1>Welcome to my (about me) site</h1> <picture> <source media="(min-width:650px)" srcset="./images/me3-650.jpg"> <source media="(min-width:465px)" srcset="./images/me3-465.jpg"> <img src="./images/me3.JPG" alt="ME" style="width:auto;"> </picture> <h3>HI there this is one of my favorite songs down below.</h3> <iframe…arrow_forwardthis is what I have so far please help and please use my code don't just post some random other persons code in and say it's mine becase that does not help me html below MY CODE <!DOCTYPE html><html> <head> <link rel="stylesheet" href="./styles/colors1.css"> <link rel="stylesheet" href="./styles/formatting1.css"> <link rel="stylesheet" href="./styles/transitions-animations1.css"><title>Home Page</title></head> <body><!--Added main tag--><main><!--Added nav tag--><nav><a href="index.html">Home</a><a href="contact.html">Contact</a><a href="about.html">About</a></nav><h1>Welcome to my about me site</h1><picture><source media="(min-width:650px)" srcset="./images/me3-650.jpg"><source media="(min-width:465px)" srcset="./images/me3-465.jpg"><img src="./images/me3.JPG" alt="ME" style="width:auto;"></picture> <h3>HI there…arrow_forwardhellllllllparrow_forward
- Here is the html <!DOCTYPE html><html><head> <title>Task 04</title> <link rel="stylesheet" type="text/css" href="task04.css"></head><body> <header> <h1><img width="300px" height="100px" src="famnit.png"></h1> <p>University Of Primorska</p> <p>Faculty of Mathematics, Natural Sciences and Information Technologies</p> <hr> <h2>Study Programs</h2> <hr> </header> <ul list-style-type: none; > <li>UNDERGRADUATE <br> STUDIES <br> 3 years, 180 ECTS <br><br> </li> <li> MASTER'S DEGREE <br> STUDIES <br> 2 years, 120 ECTS <br><br> </li> <li> DOCTORAL <br>…arrow_forwardwhat I have so far please help with what you can <!DOCTYPE html><html> <head> <title>Home Page</title> <link rel="stylesheet" type="text/css" href="./styles/colors1.css"> </head> <body> <!--Added main tag--> <main> <!--Added nav tag--> <nav> <a href="index.html">Home</a> <a href="contact.html">Contact</a> <a href="about.html">About</a> </nav> <h1>Welcome to my (about me) site</h1> <picture> <source media="(min-width:650px)" srcset="./images/me3-650.jpg"> <source media="(min-width:465px)" srcset="./images/me3-465.jpg"> <img src="./images/me3.JPG" alt="ME" style="width:auto;"> </picture> <h3>HI there this is one of my favorite songs down below.</h3> <iframe…arrow_forwardApply Boostrap to this code Source Code in HTML: <html><head><link rel="stylesheet" href="mystyle.css"></head><body><table align="center" bgcolor="skyblue"><form><tr><td colspan="2"><h1>Employee Registration Form</h1></td></tr><tr><td>Name:</td><td><input type="text" name="firstname" placeholder="firstname" size="15"/><input type="text" name="lastname" placeholder="lastname"size="15"/><br><br></td></tr><tr><td> Email Address:</td><td><input type="text" name="emailaddress" placeholder="myname@example.com" size="36"/><br><br></td></tr><tr><td> Contact Number:</td><td><input type="text" name="contact" size="36"/><br><br></td></tr><tr><td>Address:</td><td><input type="text" placeholder="Street Address"…arrow_forward
- what I have so far please help with what you can Separate your style sheets into three files:/styles/colors.css/styles/formatting.css/styles/transitions-animations.css <!DOCTYPE html><html> <head> <title>Home Page</title> <link rel="stylesheet" type="text/css" href="./styles/colors1.css"> <link rel="stylesheet" type="text/css" href=""> <link rel="stylesheet" type="text/css" href=""> </head> <body> <!--Added main tag--> <main> <!--Added nav tag--> <nav> <a href="index.html">Home</a> <a href="contact.html">Contact</a> <a href="about.html">About</a> </nav> <h1>Welcome to my (about me) site</h1> <picture> <source media="(min-width:650px)" srcset="./images/me3-650.jpg"> <source media="(min-width:465px)"…arrow_forwardwhat I have so far please help with what you can <!DOCTYPE html><html> <head> <title>Home Page</title> <link rel="stylesheet" type="text/css" href="./styles/colors1.css"> </head> <body> <!--Added main tag--> <main> <!--Added nav tag--> <nav> <a href="index.html">Home</a> <a href="contact.html">Contact</a> <a href="about.html">About</a> </nav> <h1>Welcome to my (about me) site</h1> <picture> <source media="(min-width:650px)" srcset="./images/me3-650.jpg"> <source media="(min-width:465px)" srcset="./images/me3-465.jpg"> <img src="./images/me3.JPG" alt="ME" style="width:auto;"> </picture> <h3>HI there this is one of my favorite songs down below.</h3> <iframe…arrow_forwardwhat I have so far please help with what you can Separate your style sheets into three files:/styles/colors.css/styles/formatting.css/styles/transitions-animations.css <!DOCTYPE html><html> <head> <title>Home Page</title> <link rel="stylesheet" type="text/css" href="./styles/colors1.css"> <link rel="stylesheet" type="text/css" href=""> <link rel="stylesheet" type="text/css" href=""> </head> <body> <!--Added main tag--> <main> <!--Added nav tag--> <nav> <a href="index.html">Home</a> <a href="contact.html">Contact</a> <a href="about.html">About</a> </nav> <h1>Welcome to my (about me) site</h1> <picture> <source media="(min-width:650px)" srcset="./images/me3-650.jpg"> <source media="(min-width:465px)"…arrow_forward
- this is what I have so far please help and please use my code don't just post some random other persons code in and say it's mine becase that does not help me html below MY CODE USE IT <!DOCTYPE html><html> <head> <link rel="stylesheet" href="./styles/colors1.css"> <link rel="stylesheet" href="./styles/formatting1.css"> <link rel="stylesheet" href="./styles/transitions-animations1.css"><title>Home Page</title></head> <body><main><nav><a href="index.html">Home</a><a href="contact.html">Contact</a><a href="about.html">About</a></nav><h1>Welcome to my about me site</h1><picture><source media="(min-width:650px)" srcset="./images/me3-650.jpg"><source media="(min-width:465px)" srcset="./images/me3-465.jpg"><img src="./images/me3.JPG" alt="ME" style="width:auto;"></picture> <h3>HI there this is one of my favorite songs down below…arrow_forwardwhat I have so far please help with what you can <!DOCTYPE html><html> <head> <title>Home Page</title> <link rel="stylesheet" type="text/css" href="./styles/colors1.css"> </head> <body> <!--Added main tag--> <main> <!--Added nav tag--> <nav> <a href="index.html">Home</a> <a href="contact.html">Contact</a> <a href="about.html">About</a> </nav> <h1>Welcome to my (about me) site</h1> <picture> <source media="(min-width:650px)" srcset="./images/me3-650.jpg"> <source media="(min-width:465px)" srcset="./images/me3-465.jpg"> <img src="./images/me3.JPG" alt="ME" style="width:auto;"> </picture> <h3>HI there this is one of my favorite songs down below.</h3> <iframe…arrow_forwardwhat I have so far please help with what you can <!DOCTYPE html><html> <head> <title>Home Page</title> <link rel="stylesheet" type="text/css" href="./styles/colors1.css"> </head> <body> <!--Added main tag--> <main> <!--Added nav tag--> <nav> <a href="index.html">Home</a> <a href="contact.html">Contact</a> <a href="about.html">About</a> </nav> <h1>Welcome to my (about me) site</h1> <picture> <source media="(min-width:650px)" srcset="./images/me3-650.jpg"> <source media="(min-width:465px)" srcset="./images/me3-465.jpg"> <img src="./images/me3.JPG" alt="ME" style="width:auto;"> </picture> <h3>HI there this is one of my favorite songs down below.</h3> <iframe…arrow_forward
arrow_back_ios
SEE MORE QUESTIONS
arrow_forward_ios
Recommended textbooks for you
- Computer Networking: A Top-Down Approach (7th Edi...Computer EngineeringISBN:9780133594140Author:James Kurose, Keith RossPublisher:PEARSON
Computer Organization and Design MIPS Edition, Fi...Computer EngineeringISBN:9780124077263Author:David A. Patterson, John L. HennessyPublisher:Elsevier Science
Network+ Guide to Networks (MindTap Course List)Computer EngineeringISBN:9781337569330Author:Jill West, Tamara Dean, Jean AndrewsPublisher:Cengage Learning 
Concepts of Database ManagementComputer EngineeringISBN:9781337093422Author:Joy L. Starks, Philip J. Pratt, Mary Z. LastPublisher:Cengage Learning
Prelude to ProgrammingComputer EngineeringISBN:9780133750423Author:VENIT, StewartPublisher:Pearson Education
Sc Business Data Communications and Networking, T...Computer EngineeringISBN:9781119368830Author:FITZGERALDPublisher:WILEY
Computer Networking: A Top-Down Approach (7th Edi...
Computer Engineering
ISBN:9780133594140
Author:James Kurose, Keith Ross
Publisher:PEARSON
Computer Organization and Design MIPS Edition, Fi...
Computer Engineering
ISBN:9780124077263
Author:David A. Patterson, John L. Hennessy
Publisher:Elsevier Science
Network+ Guide to Networks (MindTap Course List)
Computer Engineering
ISBN:9781337569330
Author:Jill West, Tamara Dean, Jean Andrews
Publisher:Cengage Learning
Concepts of Database Management
Computer Engineering
ISBN:9781337093422
Author:Joy L. Starks, Philip J. Pratt, Mary Z. Last
Publisher:Cengage Learning
Prelude to Programming
Computer Engineering
ISBN:9780133750423
Author:VENIT, Stewart
Publisher:Pearson Education
Sc Business Data Communications and Networking, T...
Computer Engineering
ISBN:9781119368830
Author:FITZGERALD
Publisher:WILEY