Home arrow PHP arrow Page 4 - Building a User Management Application

Style Sheet - PHP

Any application that is security critical will have some kind of method to track and maintain user activity. In this article we will begin to build a user management system that will give us control over who has access to which part of our application. This is the second part of a nine-part series.

TABLE OF CONTENTS:
  1. Building a User Management Application
  2. The database
  3. Templates
  4. Style Sheet
By: David Web
Rating: starstarstarstarstar / 12
November 24, 2008

print this article
SEARCH DEV SHED

TOOLS YOU CAN USE

advertisement

The style sheet does the job of providing a style for each element on the HTML page. Below are the styles that are defined:


body {

font-family: Verdana;

}


.header{

border:1px dotted #FF9933;

font-size:14px;

font-weight:bold;

color:#000000;

background-color:#FFCC99;}

.copy{

text-align:right;

font-size:9px;}


.welcomeheader{


color:#FFCC99;

font-size:18px;

font-weight:bold;}


/*Navstyles*/

.bord{

border:1px dashed #FF9900;

background-color:#FFCC99;}

.txt{

color:#666666;}


/*form styles*/

.error{

color:#FF0000;

font-weight:bold;}


.lbl{

font-weight:bold;}

.bordr{

border:2px solid #000000}


The first class that is defined is the header class. This class formats the header sections of the HTML code, by dictating its color, border, size and weight, etc:


.header{

border:1px dotted #FF9933;

font-size:14px;

font-weight:bold;

color:#000000;

background-color:#FFCC99;}


The result of which looks something like this:



The above header will be visible on every single page of the system. The second style that is defined formats the copyright information for the application:


.copy{

text-align:right;

font-size:9px;}

It is very short and only has two styles. It aligns the text to the right and reduces the size to nine pixels.

This is what it looks like:


The last class that is defined for the main section of the template is the welcome header class. It dictates the color, size and weight of the class:


.welcomeheader{


color:#FFCC99;

font-size:18px;

font-weight:bold;}


The result of the above code looks something like this:


The next part of the code deals with the application's navigation styles. There are two styles defined. One sets the border styles, while the other sets the text styles for the navigation text:


/*Navstyles*/

.bord{

border:1px dashed #FF9900;

background-color:#FFCC99;}

.txt{

color:#666666;}



The final section deals with the form elements. It also has two sections. The first one sets out the styles that should be applied to the error messages that will appear on the form, while the second dictates what styles should be used for the labels on the form:


/*form styles*/

.error{

color:#FF0000;

font-weight:bold;}


.lbl{

font-weight:bold;}

.bordr{

border:2px solid #000000}

In the next article we will continue to discuss the application wide scripts that we started to talk about here. See you next week!



 
 
>>> More PHP Articles          >>> More By David Web
 

blog comments powered by Disqus
escort Bursa Bursa escort Antalya eskort
   

PHP ARTICLES

- Hackers Compromise PHP Sites to Launch Attac...
- Red Hat, Zend Form OpenShift PaaS Alliance
- PHP IDE News
- BCD, Zend Extend PHP Partnership
- PHP FAQ Highlight
- PHP Creator Didn't Set Out to Create a Langu...
- PHP Trends Revealed in Zend Study
- PHP: Best Methods for Running Scheduled Jobs
- PHP Array Functions: array_change_key_case
- PHP array_combine Function
- PHP array_chunk Function
- PHP Closures as View Helpers: Lazy-Loading F...
- Using PHP Closures as View Helpers
- PHP File and Operating System Program Execut...
- PHP: Effects of Wrapping Code in Class Const...

Developer Shed Affiliates

 


Dev Shed Tutorial Topics: