Starting: 1st of Every Month 
+91 8409492687 
Contact@DevOpsSchool.com
In this blog, I am going to explain How to Generate dynamic HTML content using CSS challenge in PHP. So, before you create a page which extension should be .php file.
In this form, I am using basic HTML & CSS for form design and attractive, and for output, I am using Switch Statement with “POST” method.
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>Generate dyanamic HTML content using CSS challenge in PHP</title> | |
| </head> | |
| <style type="text/css"> | |
| p{ | |
| color:blue; | |
| } | |
| </style> | |
| <body> | |
| <form method="POST" width="80%" style="padding:1% 15%; border:2px solid black; margin:2% 30%;"> | |
| <p>Name : <input type="text" name="name"></p> | |
| <p>Email : <input type="text" name="email"></p> | |
| <p>Phone : <input type="number" name="phone"></p> | |
| <p>Message</p> <textarea name="message" rows="4" cols="28"></textarea> <br> | |
| <input style="background-color:green; color:white; border:1px solid green; padding: 5%;" value="submit" type="submit" name="submit"><br><br> | |
| </form> | |
| <p style="border:2px solid green; padding: 1% 15% ; margin:2% 30%;"> | |
| <?php | |
| if(isset($_POST['submit'])){ | |
| $name = $_POST['name']; | |
| $email = $_POST['email']; | |
| $phone = $_POST['phone']; | |
| $message = $_POST['message']; | |
| echo $name .'<br>'; | |
| echo $email .'<br>'; | |
| echo $phone .'<br>'; | |
| echo $message .'<br>'; | |
| } | |
| ?> | |
| </p> | |
| </body> | |
| </html> |
by Output-
This is a blank form in HTML with CSS.
Result-
After that when you submit this form then show result as shown below with the help for PHP.
I’m a DevOps/SRE/DevSecOps/Cloud Expert passionate about sharing knowledge and experiences. I am working at Cotocus. I blog tech insights at DevOps School, travel stories at Holiday Landmark, stock market tips at Stocks Mantra, health and fitness guidance at My Medic Plus, product reviews at I reviewed , and SEO strategies at Wizbrand.
Please find my social handles as below;
Rajesh Kumar Personal Website
Rajesh Kumar at YOUTUBE
Rajesh Kumar at INSTAGRAM
Rajesh Kumar at X
Rajesh Kumar at FACEBOOK
Rajesh Kumar at LINKEDIN
Rajesh Kumar at PINTEREST
Rajesh Kumar at QUORA
Rajesh Kumar at WIZBRAND
