I need help applying the following CSS to my html file A. Add CSS animation to change the background color from Blue to
Posted: Sun May 15, 2022 8:05 am
I need help applying the following CSS to my html file
A. Add CSS animation to change the background color from Blue to
Red to Black. You can use any HTML elements.
B. Create a horizontal and vertical navigation bar for : Hone,
About, Contact
C. Use any image from pexel.com and use Float properties to
position the image on right and left of a paragraph.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <style> /* css for table border and width 100% */ .tab{ border: 1px solid black; width: 100%; } /* css for table header's border and height of 70px as per given data */ .tab tr th{ height: 70px; border: 1px solid black; } /* Css for table data's border and aligning table data to center */ .tab tr tdk border: 1px solid black; text-align: center; } /* css for lightblue color of data at the time of hover */ .tab tr td:hover{ color: lightblue; } </style> <body> <!-- Making a class of table with the name of tab -->> <table class="tab"> <tr> <th>Firstname</th> <th>Lastname</th> <th>Mail Id</th> </tr> <td>Chicago</td> <td>Illinios</td> <td>[email protected]</td> </tr> <td>San</td> <td>Jose</td> <td>San Jose@gmil-com</td> </tr> <tr> <td>Wichita</td> <td>Kansas</td> <td>Wichita.kansas@gmil-com</td> </tr> </body> </html>
A. Add CSS animation to change the background color from Blue to
Red to Black. You can use any HTML elements.
B. Create a horizontal and vertical navigation bar for : Hone,
About, Contact
C. Use any image from pexel.com and use Float properties to
position the image on right and left of a paragraph.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <style> /* css for table border and width 100% */ .tab{ border: 1px solid black; width: 100%; } /* css for table header's border and height of 70px as per given data */ .tab tr th{ height: 70px; border: 1px solid black; } /* Css for table data's border and aligning table data to center */ .tab tr tdk border: 1px solid black; text-align: center; } /* css for lightblue color of data at the time of hover */ .tab tr td:hover{ color: lightblue; } </style> <body> <!-- Making a class of table with the name of tab -->> <table class="tab"> <tr> <th>Firstname</th> <th>Lastname</th> <th>Mail Id</th> </tr> <td>Chicago</td> <td>Illinios</td> <td>[email protected]</td> </tr> <td>San</td> <td>Jose</td> <td>San Jose@gmil-com</td> </tr> <tr> <td>Wichita</td> <td>Kansas</td> <td>Wichita.kansas@gmil-com</td> </tr> </body> </html>