Script for HTML table fading background

Asked By 20 points N/A Posted on -
qa-featured

Hi All,

I am searching for a script for HTML table fading background, I am unable to find it on the Internet, Can anyone help me so that I can use this cool effect on my page, Please do the needful, or provide me any tips on this.

With Regards,

Rebekah J Anderson

SHARE
Answered By 0 points N/A #166586

Script for HTML table fading background

qa-featured

Hello,

This is a classic problem of HTML programming. I am assuming you have some knowledge of HTML.

So there are 2 ways of applying a gradient to any element in a HTML page. Both these techniques involve CSS but one of which is CSS3.

To use a basic CSS method do the following:

  1. Download some gradient images to be used as the background ( for example, this is a good set of gradients: https://bourniio.deviantart.com/art/Gradients-67410531)
  2. You need to apply a style to your table. Do this by inserting the <style> tag in the <head> section of your HTML file, and the style should look like this:

<head>

<style>

table

{

background-image: url(‘gradient_image_name.jpg’);

}

</style>

</head>

  1. Now when you create a table using the <table> tag it will come pre-defined with the image you have selected in the CSS style for it

 

 

CSS3 gives you more power over the kinds of gradients you can apply to elements in your page. Also, they are not images, they are rather generated when the HTML code is parsed by the browser. So the 2nd method is as follow:

  1. Just like above, insert the following code into the <head> section of your HTML file:

<style>

#table

{

background: linear-gradient(red, blue);

}

</style>

  1. Now, when you create the table normally in HTML, it will show up with a red and blue gradient
  2. You can modify it further by using different colors, or changing the direction of the gradient or even deciding between linear-gradient or radial-gradient

I would strongly advise you to use CSS3 because it is supported by most browsers today including the latest versions of Firefox, Chrome and Internet Explorer.

 

About Aldwinckle Heather
Questions
0
Answers
26
Best Answers
1

Sample Portfolio performance web pages

Previous

Symantec Digital IDs for Secure Email

Next

Related Questions