Question

Use a style sheet to define the following rules and implement the given HTML code. Please...

Use a style sheet to define the following rules and implement the given HTML code. Please
put your style information within the same file as the HTML code.

Rules:

• Hyperlinks using the nodec class should display no decoration. • Hyperlinks should
display text in white with a green background color when the mouse pointer is held over
the link. (use the hover pseudo-class)
• Unordered lists not nested within any other lists should be displayed in blue text and
should be in bold.
• Ordered lists that are nested within one Unordered lists should be displayed in red
text.
• Unordered lists that are nested within one Unordered lists should be displayed in green
text and should be underlined.
• Replace “insert a web address of your choice” with a web address of your choice and
replace “Put title here” with a title that matches the URL.

HTML Body Code
<BODY>
<H2>
<a class="nodec" href="http://insert a web address of your choice.com">Put title here</a>
</H2>
<UL>
<LI>Macintosh OS</LI>
<LI>Microsoft</LI>
<OL>
<LI>Windows 98</LI>
<LI>Windows 2000</LI>
</OL>
<LI>Linux</LI>
<UL>
<LI>Redhat</LI>
<LI>Slackware</LI>
</UL>
<LI>OS/2</LI>
</UL>
</BODY>

0 0
Add a comment Improve this question Transcribed image text
Answer #1

<html>
<head>

<style>
   a{
       text-decoration:none;
       color:maroon;
   }
   a:hover{
       color:white;
       background:green;
       }
   ul{
       color:blue;
       font-style:bold;
   }
   ol{
       color:red;
   }
  
      
</style>
</head>
<body>
<h2>
<a class="nodec" href="http://google.com">Google</a>
</h2>
<ul>
<li>Macintosh OS</li>
<li>Microsoft</li>
<ol>
<li>Windows 98</li>
<li>Windows 2000</li>
</ol>
<li>linux</li>
<ul>
<li><u style="color:green;">Redhat</u></li>
<li><u style="color:green;">Slackware</u></li>
</ul>
<li>OS/2</li>
</ul>
</body>
</html>

OUTPUT:

// When you click the Google,then Google will open in the same tab.

// If you have any query please ping me.

Add a comment
Know the answer?
Add Answer to:
Use a style sheet to define the following rules and implement the given HTML code. Please...
Your Answer:

Post as a guest

Your Name:

What's your source?

Earn Coins

Coins can be redeemed for fabulous gifts.

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
  • In oython 3. HTML supports ordered and unordered lists. An ordered list is defined using element ol and each item of th...

    In oython 3. HTML supports ordered and unordered lists. An ordered list is defined using element ol and each item of the list is defined using element li. An unordered list is defined using element ul and each item of the list is defined using element li as well. For example, the unordered list in file w3c html is described using HTML code ul> <li>Web for All</li> <li>Web on Everything</li> </ul- Develop class ListCollector as a subclass of HTML Parser...

  • below is an html code, Modify the design to implement the following pattern. “Sticky Footer”. <!DOCTYPE...

    below is an html code, Modify the design to implement the following pattern. “Sticky Footer”. <!DOCTYPE html> <html lang="en"> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Responsive Menu Lab</title> <style type="text/css"> div { border: 1px solid blue; margin: 5px; }    #container { width: 98%; margin: auto; }    #main { padding: 10px; } #menu { list-style: none; padding-left: 2px; }    #menu li { display: inline-block; width: 70px; }    #menu li a { display: block; text-decoration: none; } </style> </head>...

  • Question 1: Given the following HTML code segment <p>While this is a <b> very basic HTML...

    Question 1: Given the following HTML code segment <p>While this is a <b> very basic HTML document </b>, it actually serves as a detailed example of the document object model. </p> How many text nodes will be added to the DOM tree to represent the structure of text content in this HTML code segment A. 1 B. 2 C. 3 D. 4 Question 2: Assume in an HTML document named “index.html”, the following <script> element is added <script src="grocery.js"></script> This...

  • Code for the movies page: <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />...

    Code for the movies page: <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="stylesheet" type="text/css" href="style.css" /> <title>Daniel's Movie Page</title> </head> <body> <a href="hobbies.html">Hobbies</a> <h1>Movies and Actors</h1> <ol> <li class="ol-list1">Gravity</li> <li>Avenger</li> <li>Marshal</li> <li>Interstellar</li> <li>Dark Knight</li> <li>Superman</li> </ol> <ul> <li class="ul-list1">Robet Downey jr.</li> <li>Sharuk Khan</li> <li>Ranbir Kapoor</li> <li>Sidhhart Malhotra</li> <li>Angela Joli</li> <li>Leonardo DiCaprio/li> </ul> <h2>Favorite Movie</h2> <p> <b>Gravity:</b> The movie portrayed what happens to an astronaut if he/she is pushed away from spaceship.It was terrifying how much...

  • 6. (HTML) Given the following HTML document: <html> <head> <title>Grandma Cafe</title> </head> <body> <h1>Menu</h1> <ol> <li>Café...

    6. (HTML) Given the following HTML document: <html> <head> <title>Grandma Cafe</title> </head> <body> <h1>Menu</h1> <ol> <li>Café Latte</li> <li>Café Mocha</li> <li>Cappuccino</li> </ol> <img src="https://businessexchange.ca/wp-content/uploads/2018/05/coffee- shop-1.jpg" /> </body> </html> a. [4] Sketch approximately how it will be displayed in a web browser. (For media items such as images, just draw a box labelled with the media type.) b. [2] What is the protocol, hostname, top-level domain name, and file name of the image being linked here?

  • Create a html5 document template. the correct HTML5 document structure (!doctype, html, head, body) a title...

    Create a html5 document template. the correct HTML5 document structure (!doctype, html, head, body) a title for your web page heading tags to break up the various sections of your content (About Me, Education, Employment, etc.) paragraph tags around all paragraphs a link to at least two websites (perhaps link to your college or place of employment) at least one ordered or unordered list (perhaps for your interests or accomplishments) at least one image Your html page should include ALL...

  • I have never created an external style before. This is the main Html that I am...

    I have never created an external style before. This is the main Html that I am using. <!doctype html> <html lang="en"> <head> <!--Madison McCuiston--> <meta charset="utf-8"> <title>Amelie Boulangerie</title> <link href="style.css" rel="stylesheet" type="text/css"> </head> <body> <div id="wrapper"> <header>Amelie Boulangerie</header> <!-- change this to header tag --> <nav> <ul> <li><a href="index.html">Home</a></li> <li><a href="pastries.html">Pastries</a></li> <li><a href="events.html">Events</a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> <main> <H2>Experience the Difference</H2> <p><span class="bakery">Amelie Boulangerie</span> is the master of flavor combinations.The jewel-colored macarons come in the most tempting of flavors. Experience...

  • Hello Ive been tryting to add the CDN of jquery to my html code and I...

    Hello Ive been tryting to add the CDN of jquery to my html code and I keep getting an error Need help with this : ​​ Navigate to www.code.jquery.com in your Chrome browser. On this page, you'll find different stable versions of jQuery. Select uncompressed for jQuery Core 3.3.1. Copy the <script> tag that is given to you. In store_hours.html, paste that tag directly above your body's closing tag. This is the jQuery CDN. After you paste this code into...

  • CST 231   Web Systems         Fall 2017    Due Friday, December 8, 2017 at 11:59pm. Choose three...

    CST 231   Web Systems         Fall 2017    Due Friday, December 8, 2017 at 11:59pm. Choose three Problems Only. 100 points total 1 (25 pts.). The HTML document listed below (with gaps) is rendered as shown at right. The header at the top is an h3 element subject to a CSS rule (see below) causing its font to be Courier New. The boxed content is that of a p element whose class is box (see below), which specifies, among other things,...

  • <!DOCTYPE html> <html> <body> <!-- replace the text below with your name!--> <!-- --> <!-- -->...

    <!DOCTYPE html> <html> <body> <!-- replace the text below with your name!--> <!-- --> <!-- --> <title> TYPE YOUR NAME HERE</title> <script> // // Write a program that prompts the user to enter a number within the range of // 1 through 10 and calls a function to display the roman numeral version of // that number. If the number is outside the range of 1 through 10, the program // should display an error message. // // The following...

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