Homework Help is Here – Start Your Trial Now!
Engineering
Computer Engineering
1. Open the index.html file and update the comment with your name (firstname lastname), the file name, and today's date (MM/DD/YYYY). Link the index.html file to the style sheet located within the /css folder. 2. Use your browser to find a CSS color picker and color converter (you can find one here). Use the color picker to find a shade of orange. Any orange color variation is fine. 3. Open the styles.css file and locate the Orange comment. Below the comment, create a style rule for the class selector, orange-hex , that sets a background color to orange using a hexadecimal color value. 4. Create another style rule for the class selector, orange-rgb, that sets a background color to the same orange color created in task 3, but use an RGB color value instead of hexadecimal. Use a color converter to find the equivalent RGB color value. 5. Create another style rule for the class selector, orange-hsl, that sets a background color to the same orange color created in task 3, but use an HSL color value instead of hexadecimal. Use a color converter to find the equivalent HSL color value. 6. Use the color picker to find a shade of purple. Any purple color variation is fine. 7. Locate the Purple comment in the styles.css file. Below the comment, create a style rule for the class selector, purple-hex , that sets a background color to purple using a hexadecimal color value. 8. Create another style rule for the class selector, purple-rgb, that sets a background color to the same purple color created in task 7, but use an RGB color value instead of hexadecimal. Use a color converter to find the equivalent RGB color value. 9. Create another style rule for the class selector, purple-hsl,that sets a background color to the same purple color created in task 7, but use an HSL color value instead of hexadecimal. Use a color converter to find the equivalent HSL color value. 10. Use the color picker to find a shade of green. Any green color variation is fine. 11. Locate the Green comment in the styles.css file. Below the comment, create a style rule for the class selector, green-hex , that sets a background color to green using a hexadecimal color value. 12. Create another style rule for the class selector, green-rgb,that sets a background color to the same green color created in task 11, but use an RGB color value instead of hexadecimal. Use a color converter to find the equivalent RGB color value. 13. Create another style rule for the class selector, green-hsl, that sets a background color to the same green color created in task 11, but use an HSL color value instead of hexadecimal. Use a color converter to find the equivalent HSL color value.

1. Open the index.html file and update the comment with your name (firstname lastname), the file name, and today's date (MM/DD/YYYY). Link the index.html file to the style sheet located within the /css folder. 2. Use your browser to find a CSS color picker and color converter (you can find one here). Use the color picker to find a shade of orange. Any orange color variation is fine. 3. Open the styles.css file and locate the Orange comment. Below the comment, create a style rule for the class selector, orange-hex , that sets a background color to orange using a hexadecimal color value. 4. Create another style rule for the class selector, orange-rgb, that sets a background color to the same orange color created in task 3, but use an RGB color value instead of hexadecimal. Use a color converter to find the equivalent RGB color value. 5. Create another style rule for the class selector, orange-hsl, that sets a background color to the same orange color created in task 3, but use an HSL color value instead of hexadecimal. Use a color converter to find the equivalent HSL color value. 6. Use the color picker to find a shade of purple. Any purple color variation is fine. 7. Locate the Purple comment in the styles.css file. Below the comment, create a style rule for the class selector, purple-hex , that sets a background color to purple using a hexadecimal color value. 8. Create another style rule for the class selector, purple-rgb, that sets a background color to the same purple color created in task 7, but use an RGB color value instead of hexadecimal. Use a color converter to find the equivalent RGB color value. 9. Create another style rule for the class selector, purple-hsl,that sets a background color to the same purple color created in task 7, but use an HSL color value instead of hexadecimal. Use a color converter to find the equivalent HSL color value. 10. Use the color picker to find a shade of green. Any green color variation is fine. 11. Locate the Green comment in the styles.css file. Below the comment, create a style rule for the class selector, green-hex , that sets a background color to green using a hexadecimal color value. 12. Create another style rule for the class selector, green-rgb,that sets a background color to the same green color created in task 11, but use an RGB color value instead of hexadecimal. Use a color converter to find the equivalent RGB color value. 13. Create another style rule for the class selector, green-hsl, that sets a background color to the same green color created in task 11, but use an HSL color value instead of hexadecimal. Use a color converter to find the equivalent HSL color value.

Computer Networking: A Top-Down Approach (7th Edition)
Computer Networking: A Top-Down Approach (7th Edition)
7th Edition
ISBN:9780133594140
Author:James Kurose, Keith Ross
Publisher:James Kurose, Keith Ross
Chapter1: Computer Networks And The Internet
Section: Chapter Questions
Problem R1RQ: What is the difference between a host and an end system? List several different types of end...
See similar textbooks
icon
Related questions
Question
100%

Below are the files needed for the assignment. Thank you in advance. I've used my textbook, looked up guides, and reviewed my notes already.

FILE #1

<!DOCTYPE html>
<!--  
  Student Name: Jordan Collins
  File Name: index.hmtl
  Date: 10/13/2021
-->
<html lang="en">
<head>
  <title>CH 4 Extend Your Knowledge</title>
  <meta charset="utf-8">
  <link rel=“stylesheet” href=“css/styles.css”>
</head>
<body>

  <header>
    <h1>CSS Colors</h1>
  </header>
  
  <main>
  
    <div id="color">
            
            <div id="orange">
                <h2>Orange</h2>
            
                <div class="box orange-hex">Hex Orange</div>

                <div class="box orange-rgb">RGB Orange</div>

                <div class="box orange-hsl">HSL Orange</div>
                
            </div>
            
            <div id="purple">
                <h2>Purple</h2>
                
                <div class="box purple-hex">Hex Purple</div>

                <div class="box purple-rgb">RGB Purple</div>

                <div class="box purple-hsl">HSL Purple</div>
                
            </div>
            
            <div id="green">
                <h2>Green</h2>
            
                <div class="box green-hex">Hex Green</div>

                <div class="box green-rgb">RGB Green</div>

                <div class="box green-hsl">HSL Green</div>
                
            </div>
            
            <div id="questions">
                <!-- Use the paragraph element below to identify the online color converter you used to complete this assignment. Include an absolute link to your resource and include the target attribute to open the page in a new tab. -->
                <p>Color Converter Used: </p>

                <!-- Use the paragraph element below to compare and contrast your findings regarding hexadecimal, RGB, and HSL color codes. -->
                <p> </p>

                <!-- Use the paragraph element below to identify your preferred color code format (hexadecimal, RBG, or HSL) and why. -->
                <p>Preferred color code format: </p>
                
                <!-- Use the paragraph element to discuss HWB color. -->
                <p>HWB summary</p>
                
                <!-- Use the paragraph element to discuss CMYK color. -->
                <p>CMYK summary</p>
            
            </div>
        
        </div>
  
  </main>
  
    <!-- Add a class attribute to the footer element below to set a background color of light blue. Use hexadecimal. -->
  <footer>
    <p>Student Name: </p>
    <p>Chapter 4, Extend Your Knowledge</p>
  </footer>

</body>
</html>
 
FILE #2
 
/*
Author: Maria Cruz
Date: Current Date
File Name: styles.css
*/

/* CSS Reset */
body, header, nav, main, footer, h1, h2 {
    margin: 0;
    padding: 0;
    border: 0;
}

/* Style rules for body and header content */
body {
    background-color: #d9d9d9;
}

header, footer {
    padding: 2%;
    text-align: center;
}

/* Style rules for main content */
main {
    padding: 2%;
    overflow: auto;
}

main p {
    font-size: 1.25em;
    padding: 2%;
}

main a {
    color: #0000b3;
    text-decoration: none;
}

#orange, #purple, #green {
    display: block;
    margin-bottom: 2%;
    text-align: center;
    width: 33%;
    float: left;
}

#questions {
    clear: left;
}

.box {
    height: 100px;
    width: 100px;
    border: 1px solid #000;
    display: inline-block;
    padding-top: 5%;
}

/* Orange */
orange-hex
  background-color: #ff9900;
  

/* Purple */


/* Green */
Perform the following tasks: 1. Open the index.html file and update the comment with your name (firstname lastname), the file name, and today's date (MM/DD/YYYY). Link the index.html file to the style sheet located within the /css folder. 2. Use your browser to find a CSS color picker and color converter (you can find one here). Use the color picker to find a shade of orange. Any orange color variation is fine. 3. Open the styles.css file and locate the Orange comment. Below the comment, create a style rule for the class selector, orange-hex , that sets a background color to orange using a hexadecimal color value. 4. Create another style rule for the class selector, orange-rgb, that sets a background color to the same orange color created in task 3, but use an RGB color value instead of hexadecimal. Use a color converter to find the equivalent RGB color value. 5. Create another style rule for the class selector, orange-hsl, that sets a background color to the same orange color created in task 3, but use an HSL color value instead of hexadecimal. Use a color converter to find the equivalent HSL color value. 6. Use the color picker to find a shade of purple. Any purple color variation is fine. 7. Locate the Purple comment in the styles.css file. Below the comment, create a style rule for the class selector, purple-hex , that sets a background color to purple using a hexadecimal color value. 8. Create another style rule for the class selector, purple-rgb , that sets a background color to the same purple color created in task 7, but use an RGB color value instead of hexadecimal. Use a color converter to find the equivalent RGB color value. 9. Create another style rule for the class selector, purple-hsl, that sets a background color to the same purple color created in task 7, but use an HSL color value instead of hexadecimal. Use a color converter to find the equivalent HSL color value. 10. Use the color picker to find a shade of green. Any green color variation is fine. 11. Locate the Green comment in the styles.css file. Below the comment, create a style rule for the class selector, green-hex , that sets a background color to green using a hexadecimal color value. 12. Create another style rule for the class selector, green-rgb , that sets a background color to the same green color created in task 11, but use an RGB color value instead of hexadecimal. Use a color converter to find the equivalent RGB color value. 13. Create another style rule for the class selector, green-hsl, that sets a background color to the same green color created in task 11, but use an HSL color value instead of hexadecimal. Use a color converter to find the equivalent HSL color value.
Transcribed Image Text:Perform the following tasks: 1. Open the index.html file and update the comment with your name (firstname lastname), the file name, and today's date (MM/DD/YYYY). Link the index.html file to the style sheet located within the /css folder. 2. Use your browser to find a CSS color picker and color converter (you can find one here). Use the color picker to find a shade of orange. Any orange color variation is fine. 3. Open the styles.css file and locate the Orange comment. Below the comment, create a style rule for the class selector, orange-hex , that sets a background color to orange using a hexadecimal color value. 4. Create another style rule for the class selector, orange-rgb, that sets a background color to the same orange color created in task 3, but use an RGB color value instead of hexadecimal. Use a color converter to find the equivalent RGB color value. 5. Create another style rule for the class selector, orange-hsl, that sets a background color to the same orange color created in task 3, but use an HSL color value instead of hexadecimal. Use a color converter to find the equivalent HSL color value. 6. Use the color picker to find a shade of purple. Any purple color variation is fine. 7. Locate the Purple comment in the styles.css file. Below the comment, create a style rule for the class selector, purple-hex , that sets a background color to purple using a hexadecimal color value. 8. Create another style rule for the class selector, purple-rgb , that sets a background color to the same purple color created in task 7, but use an RGB color value instead of hexadecimal. Use a color converter to find the equivalent RGB color value. 9. Create another style rule for the class selector, purple-hsl, that sets a background color to the same purple color created in task 7, but use an HSL color value instead of hexadecimal. Use a color converter to find the equivalent HSL color value. 10. Use the color picker to find a shade of green. Any green color variation is fine. 11. Locate the Green comment in the styles.css file. Below the comment, create a style rule for the class selector, green-hex , that sets a background color to green using a hexadecimal color value. 12. Create another style rule for the class selector, green-rgb , that sets a background color to the same green color created in task 11, but use an RGB color value instead of hexadecimal. Use a color converter to find the equivalent RGB color value. 13. Create another style rule for the class selector, green-hsl, that sets a background color to the same green color created in task 11, but use an HSL color value instead of hexadecimal. Use a color converter to find the equivalent HSL color value.
14. View the index.html in your browser. 15. In the index.html file, use a paragraph element to identify the online color converter you used to help complete this assignment. Include a link to your resource that opens in a new tab. 16. Use your browser to research the differences between hexadecimal, RGB, and HSL CsS color codes. Use a paragraph element to summarize your findings. 17. Use a paragraph element to identify your preferred CSS color code format. 18. Use a empty paragraph element to provide a summary of HWB color. 19. Use a empty paragraph element to provide a summary of CMYK color. 20. Validate the HTML and CSS files. Correct any errors.
Transcribed Image Text:14. View the index.html in your browser. 15. In the index.html file, use a paragraph element to identify the online color converter you used to help complete this assignment. Include a link to your resource that opens in a new tab. 16. Use your browser to research the differences between hexadecimal, RGB, and HSL CsS color codes. Use a paragraph element to summarize your findings. 17. Use a paragraph element to identify your preferred CSS color code format. 18. Use a empty paragraph element to provide a summary of HWB color. 19. Use a empty paragraph element to provide a summary of CMYK color. 20. Validate the HTML and CSS files. Correct any errors.
Expert Solution
trending now

Trending now

This is a popular solution!

steps

Step by step

Solved in 2 steps

SEE SOLUTIONCheck out a sample Q&A here
Blurred answer
Recommended textbooks for you
Computer Networking: A Top-Down Approach (7th Edi…
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 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)
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
Concepts of Database Management
Computer Engineering
ISBN:
9781337093422
Author:
Joy L. Starks, Philip J. Pratt, Mary Z. Last
Publisher:
Cengage Learning
Prelude to Programming
Prelude to Programming
Computer Engineering
ISBN:
9780133750423
Author:
VENIT, Stewart
Publisher:
Pearson Education
Sc Business Data Communications and Networking, T…
Sc Business Data Communications and Networking, T…
Computer Engineering
ISBN:
9781119368830
Author:
FITZGERALD
Publisher:
WILEY
SEE MORE TEXTBOOKS