Question

1.Create style definitions that format navigational buttons. The buttons should contain a background that starts with wh...

1.Create style definitions that format navigational buttons. The buttons should contain a background that starts with white on the left and ends with red. The buttons should contain a dashed red border of size 2 pixels. The links should not contain any underlines. When a user points to a button, the font colors should change to black.

2.Write style definitions that format table and table elements. The table should display on the right hand side of the screen. All the cells should have dotted navy border of size 5 pixels. The even rows should have a background image. Make sure that the cell borders don't have a gap between them.

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

Dear Student ,

As per the requirement submitted above , kindly find the below solution.

Here a new web page with name "cssDemo.html" is created, which contains following code.

cssDemo.html :

<!DOCTYPE html>

<html lang="en">

<head>

<title>Css Demo</title>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- <link> is used for internal stylesheet -->

<style>

/* style rule for li */

li{

display: inline;

background: linear-gradient(to right,white,red);

border:2px dashed red;

list-style-type: none;

}

/* style rule for hyperlink */

a{

text-decoration: none;

}

/* style rule when mouse is on hyperlink */

a:hover{

color: black;

}

/* style rule for table to align right side */

table{

float: right;

}

/* style rule for th and td */

th,td{

border: 5px dotted navy;

}

/* style rule for even row */

tr:nth-of-type(even)

{

background-image: url('1.jpg');

}

</style>

</head>

<body>

<ul>

<li><a href="">Home</a></li>

<li><a href="">About</a></li>

</ul>

<table>

<tr>

<th>ID</th>

<th>Name</th>

<th>Runs</th>

</tr>

<tr>

<td>1</td>

<td>Virat Kohli</td>

<td>23000</td>

</tr>

<tr>

<td>2</td>

<td>Virat Kohli</td>

<td>23000</td>

</tr><tr>

<td>3</td>

<td>Virat Kohli</td>

<td>23000</td>

</tr><tr>

<td>4</td>

<td>Virat Kohli</td>

<td>23000</td>

</tr><tr>

<td>5</td>

<td>Virat Kohli</td>

<td>23000</td>

</tr>

</table>

</body>

</html>

======================================================

Output : Open web page cssDemo.html in the browser and will get the screen as shown below

Screen 1 :cssDemo.html

Css Demo ← → ⓘ localhost8080/cssDemo.html ID NameRuns .:Virat Kohli: 230003 4Virat Kohli::23000:

NOTE : PLEASE FEEL FREE TO PROVIDE FEEDBACK ABOUT THE SOLUTION.

Add a comment
Know the answer?
Add Answer to:
1.Create style definitions that format navigational buttons. The buttons should contain a background that starts with wh...
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
  • Problems: Develop a web page that allows a user to try out different text and background...

    Problems: Develop a web page that allows a user to try out different text and background color combinations by clicking buttons. Use Javascript to implement the functionalities. Below are two screen shots of the working application. Clicking the buttons at the bottom changes either the foreground color or the background color. The following descriptions are about the details. Specifically, you have to implement: An HTML file should include the following features (3 points) Some texts (Anything you like) Put the...

  • Create a CSS-styled Table Page For this Assignment you will first read the appropriate chapters in...

    Create a CSS-styled Table Page For this Assignment you will first read the appropriate chapters in the textbook and then a create web page, for example called table.html, in your ubunix.buffalo.eduaccount just as you did in Home Page Assignment. Assignment Requirements Your new web page should utilize the following HTML tags and include the following: A <body> tag that uses an appropriate style value to change the background color of the web page. Appropriate <table>, <tr>, <th>, and <td> tags...

  • Need help with creating this JavaScript file. I'm not sure where or how to begin. 1. You are working solely with the DOM object. Thus, you should be coding primarily in the js file. You must use...

    Need help with creating this JavaScript file. I'm not sure where or how to begin. 1. You are working solely with the DOM object. Thus, you should be coding primarily in the js file. You must use the addEventListener, in addition you may need to use id and class attributes as needed. The .html and .css files have been provided to you. See the .png files for an example of what is expected. 2. Place the javaScript file in its...

  • Need help starting from question 9. I have tried multiple codes but the program says it is incorrect. Case Problem 1 Da...

    Need help starting from question 9. I have tried multiple codes but the program says it is incorrect. Case Problem 1 Data Files needed for this Case Problem: mi pricing_txt.html, mi_tables_txt.css, 2 CSS files, 3 PNG files, 1 TXT file, 1 TTF file, 1 WOFF file 0 Marlin Internet Luis Amador manages the website for Marlin Internet, an Internet service provider located in Crystal River, Florida. You have recently been hired to assist in the redesign of the company's website....

  • Java Painter Class This is the class that will contain main. Main will create a new...

    Java Painter Class This is the class that will contain main. Main will create a new Painter object - and this is the only thing it will do. Most of the work is done in Painter’s constructor. The Painter class should extend JFrame in its constructor.  Recall that you will want to set its size and the default close operation. You will also want to create an overall holder JPanel to add the various components to. It is this JPanel that...

  • 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...

  • Your page will simulate a reservation form for a hotel stay. It should include the following:...

    Your page will simulate a reservation form for a hotel stay. It should include the following: Name à Text field Email à Text field Number of nights à Text field (of size 3) Type of room? à Select box with options for Regular ($100), Deluxe ($150), Suite ($250) Would you like to join our Frequent Travellers Club? If you join, we will take $50 off your first order. à Checkbox Write the function that will confirm what the user requested....

  • Hello, this is my code. moest of the things works but when select the price, i...

    Hello, this is my code. moest of the things works but when select the price, i just dont get my total. can someone help me out . thank you My queshion is also here The page will simulate the site for a Chicago-based small bus line that travels to St Louis, Milwaukee, and Detroit. Here are the requirements: The home page (i.e. the main page) should simply be the heading, image, and slogan of the site.  The home page should NOT...

  • Design an original, professional web site following the specifications listed below. This web sit...

    Design an original, professional web site following the specifications listed below. This web site will be for a business you plan to set up for yourself or for someone else. The following is a detailed list of the requirements for your web site. READ them carefully. Instructions - Web Site Requirements for the web site: General: You will thoroughly test all your pages in more than one browser. All links MUST work. All graphics must show on the page. All...

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