Improving the blogger’s visual appearance - PHP

By following a similar approach to the one I took when I included a basic client-side validation mechanism, I’ll also provide the blog application with a few CSS rules aimed at improving the corresponding visual presentation. As you’ll imagine, this task can be easily achieved by including the CSS file listed below. Here is the file in question:

body{

            background: #eee;

            margin: 0;

            padding: 0;

}

h1{

            width: 600px;

            padding: 10px;

            margin-left: auto;

            margin-right: auto;

            background: #339;

            font: bold 20px Arial, Helvetica, sans-serif;

            color: #fff;

            border: 1px solid #000;

}

h2{

            font: bold 18px  Arial, Helvetica, sans-serif;

            color: #339;

}

h3{

            font: bold 16px Arial, Helvetica, sans-serif;

            color: #339;

}

textarea{

            width: 300px;

            height: 200px;

            font: normal 12px Arial, Helvetica, sans-serif;

            color: #000;

}

.blog{

            width: 600px;

            padding: 10px;

            margin-left: auto;

            margin-right: auto;

            margin-bottom: 5px;

            background: #ccf;

            border: 1px solid #000;

}

.blog p{

            font: normal 12px Arial, Helvetica, sans-serif;

            color: #000;

}

.dataform{

            width: 600px;

            height: 410px;

            padding: 10px;

            margin-left: auto;

            margin-right: auto;

            margin-bottom: 5px;

            background: #dccae8;

            border: 1px solid #000; 

}

.dataform p{

            margin: 5px;

            font: normal 12px Arial, Helvetica, sans-serif;

            color: #339;

}

.datafield{

            width: 300px;

            font: normal 12px Arial, Helvetica, sans-serif;

            color: #000;

}

.error{

            margin: 0 0 0 5px;

            font: normal 12px Arial, Helvetica, sans-serif;

            color: #f30;

} 

Finally, the blog application has been completed! In this case, I decided to include the above CSS declarations, but this feature can be easily modified to suit your personal taste.

Final thoughts

Sad but true, we’ve come to the end of this series. In this hopefully instructive journey, you learned how to build a highly expansible blogger with PHP 5, which allows you to insert, update and delete entries very easily.

In this case I purposely used the term “expansible.” You can introduce your own modifications to the application to extend its existing functionality. See you in the next PHP tutorial!