Question

i was wondering if i could get an example code for the following Using the Make...

i was wondering if i could get an example code for the following

Using the Make a Fancy Table example from W3Schools as a guide, create your own fancy table.

Your table should have two columns: Course Number, Course Name.

Fill in each row with information on the courses you're planning to take next semester.

Each course number should be hyperlinked to the catalog entryfor that course.

Add a caption that says Fall Semester 2018.

Add an appropriate title to your webpage.

Make sure to use an external style sheet--not the style tag.

Choose a different color than the one in the W3 Schools' Fancy Tableexample for the header row.

Choose a different font family than the one in the W3 Schools' Fancy Table example.

Add in best practices and validate your work.

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 "fancyTable.html" is created.This page is using CSS file with name "fancyTable.css".Following section gives details about above files.

fancyTable.html :

<!DOCTYPE html>

<html lang="en">

<head>

<!--title for web page -->

<title>Fancy Table in HTML</title>

<!-- <link< is used to refer external css file -->

<link rel="stylesheet" href="fancyTable.css"/>

</head>

<body>

<!--table -->

<table>

<!--caption for table -->

<caption>Fall Semester 2018</caption>

<tr>

<th>Course Number</th>

<th>Course Name</th>

</tr>

<tr>

<td>

<!--hyperlink for catalog entry -->

<!--kindly change this url , href property as per requirement -->

<a href="catalogEntry.html">101</a>

</td>

<td>

C Programming

</td>

</tr>

<tr>

<td>

<!--hyperlink for catalog entry -->

<!--kindly change this url , href property as per requirement -->

<a href="catalogEntry.html">102</a>

</td>

<td>

JAVA Programming

</td>

</tr>

<tr>

<td>

<!--hyperlink for catalog entry -->

<!--kindly change this url , href property as per requirement -->

<a href="catalogEntry.html">103</a>

</td>

<td>

.NET with Visual Studio 2017

</td>

</tr>

<tr>

<td>

<!--hyperlink for catalog entry -->

<!--kindly change this url , href property as per requirement -->

<a href="catalogEntry.html">104</a>

</td>

<td>

ASP.NET MVC With Entity Framework

</td>

</tr>

<tr>

<td>

<!--hyperlink for catalog entry -->

<!--kindly change this url , href property as per requirement -->

<a href="catalogEntry.html">105</a>

</td>

<td>

MEAN STACK

</td>

</tr>

<tr>

<td>

<!--hyperlink for catalog entry -->

<!--kindly change this url , href property as per requirement -->

<a href="catalogEntry.html">106</a>

</td>

<td>

Angular 6

</td>

</tr>

</table>

</body>

</html>

*************************************

fancyTable.css :

/* External Stylesheet file */

/*style for table */

table{

width:100%;

border-collapse: collapse;

font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif

}

/*style for table caption */

caption {

font-size: 24px;

margin-bottom: 10px;

}

/*style for table cells */

td,th{

border : 2px solid green;

padding: 10px;

}

/*style for even row */

tr:nth-child(even)

{

background-color: aqua;

}

/* style when mouse on any row */

tr:hover{

background-color: yellow;

color: blue;

border:5px solid red;

}

/*style for th */

th{

color: white;

background-color: maroon;

text-align: left;

padding: 12px;

}

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

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

Screen 1 :fancyTable.html

Fancy Table in HTML KC localhost:8080/Website/fancyTable.html Fall Semester 2018 Course Number Course Name 101 C Programming AVA Programming NET with Visual Studio 2017 ASP.NET MVC With Entity Framework MEAN STACK Angular 6 102 103 105 106

Screen 2 : Hover the mouse over any row , will get the screen as shown below

Screen 3 : Validated fancyTable.html using https://validator.w3.org

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

Add a comment
Know the answer?
Add Answer to:
i was wondering if i could get an example code for the following Using the Make...
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
  • i need help with this homework webpage and code too: The webpage must include: Global Structure...

    i need help with this homework webpage and code too: The webpage must include: Global Structure Tags Text Tags Images   Your first page must be named index.html Include a table within your site, challenge yourself to add a header in the table, and choose interesting border and/or cell formatting. Include a hyperlink within your site. Include an image in your site. Include a form in your site to demonstrate understanding of a variety of form components (the form does not...

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

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

  • I need html coding in notepad++ according to the requirments those are listed in the pictures....

    I need html coding in notepad++ according to the requirments those are listed in the pictures. The purpose of this assignment is to figure out the designing and development of HTML forms with CSS and interaction between users and forms by using the Javascript script language. Below Student Registration Form views some form inputs entered by users and shows in the form as a response. Resources: All posted class documents and lab practices will help to complete this assignment. Student...

  • For milestone #1, we will start the CARIT site with three static HTML pages and a...

    For milestone #1, we will start the CARIT site with three static HTML pages and a CSS file. Create a dedicated folder for this project. This folder should contain all related files in this project. The future milestones are cumulative and built directly on top of your prior work. Function/content requirements: A home page named “index.html”, which include these contents at least: Description of the center. You may reference the example sites. Latest news: use list tags; make up some...

  • Please code in C++. link to continue the code is this below or you can make...

    Please code in C++. link to continue the code is this below or you can make your own code if you wish(fix any mistakes if you think there are any in it): cpp.sh/3qcekv 3. Submit a header file (project3.h), a definition file (project3.cpp), a main file (main.cpp), and a makefile to compile them together. Make sure to run the command make and produce an application file and include it with your submission. For this project, you are required to create...

  • Please Implement this code using Java Eclipse. CIS 1068 Assignment 8 Warm Up with Objects Due:...

    Please Implement this code using Java Eclipse. CIS 1068 Assignment 8 Warm Up with Objects Due: Wednesday, March 25 70 points (+ up to 15 extra credit) The purpose of this assignment is to give you practice implementing your own classes. It also provides extra practice with arrays. Task Implement a class Task, which is used to represent a job that should be done. It should contain the following private fields: .name text description of what job should be done...

  • i need help making this program the skeleton of the code is below: //Include the following #include <iostream> #...

    i need help making this program the skeleton of the code is below: //Include the following #include <iostream> #include <string> #include <fstream> //you must include this library if you wish to do file i/o using namespace std; /********************************************************* //Following is the declaration of a order record **********************************************************/ class order_record { public: string cell_number; string item_number; double quantity; double price; int processing_plant; double tax_rate; double order_tax; double net_cost; double total_cost; }; //Prototypes for your functions: input, output, and process will go...

  • COMPLETE THE FOLLOWING USING THE ATTACHED DOCUMENTS In this exercise, you will perform a financial statement...

    COMPLETE THE FOLLOWING USING THE ATTACHED DOCUMENTS In this exercise, you will perform a financial statement analysis for Water Feature Designers Inc. You will perform horizontal/vertical analyses and create charts to highlight key information from these analyses. You will also calculate financial ratios and insert cell comments. Use this information to complete the ratio analysis. Ratio Current Ratio Debt-to-Equity Ratio Profit Margin 2016 7.62 0.17 .186 2015 3.45 0.28 292 2014 8.21 0.18 255 1. Open EA9-A2-FSA from your Chapter...

  • i need help with a mips program to to covert roman numerals to real numbers Lab 4: Roman Numeral Conversion Part A: Due...

    i need help with a mips program to to covert roman numerals to real numbers Lab 4: Roman Numeral Conversion Part A: Due Sunday, 19 May 2019, 11:59 PM Due Friday, 24 May 2019, 11:59 PM Part B: Minimum Submission Requirements Ensure that your Lab4 folder contains the following files (note the capitalization convention): o Diagram.pdf o Lab4. asm O README.txt Commit and push your repository Lab Objective In this lab, you will develop a more detailed understanding of how...

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