Advertisement
Writing to file using PHP Form - Step 2: CSS Codes
Step 2: CSS Codes
Now we will use CSS to add borders around our form fields and padding between text and borders, and we will also set the colour of our text using CSS.
To do this, Make a new document, and write this code:
CSS Code:
input {
border: 1px solid #a4bf37;
padding: 5px;
color : #2d2d2d;
}
input:hover {
border: 1px solid #C1DB3F;
color : #3e3e3e;
}
Here we defined propertied for all input tags, because we didn’t define any class or id.
We used 3 properties :
- border -> will show a border around inputs.
- padding -> will define the space between the element border and the element content.
- color -> will change the text colour.
And to change the properties of our class on mouse over, we used hover with a colon, and wrote new properties in it.
Save the file as style.css
Now we will integrate this stylesheet in our page.
To do this, open your form.php
After your <title> tags, write this code:
HTML Code:
<link rel="stylesheet" type="text/css" href="style.css" />
So our code will look like this :
HTML Code:
<html>
<head>
<title>This will be your Page's title</title> <!-- You can change the title, set whatever you want -->
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body> <!-- Printing on page starts from here -->
<!-- This is a comment and will not be printed on page -->
<form action="" method="POST">
Name: <input type="text" name="name" /> <br />
Age: <input type="text" name="age" /> <br />
<input type="hidden" name="hidden" value="Hello, I submitted the form" />
<input type="submit" name="submit" value="Write it !" />
</form> <!-- Ending the form -->
</body>
</html>
And our Form is completed, now we can proceed to Next Step.
Writing to file using PHP Form - Step 3: PHP Code