You are on page 1of 2

For the Link to look like a button the good sizes for the padding are 10px by 40px

To add a background image to a website use background:url(path without quotes);


To add a background shadow for a box when it is hovered (usually these are used for
hyperlink buttons) use
box-shadow: 0px 1px 6px rgba(0,0,0,0.6);
where 0 px is x axis horizontal position of the shadow
1 px is y asix vertical position of the shadow
6 px is the blur
Rgba is the color of the blur which can be specified in hex code.
Bootstrap grid system
To create a row with columns
<div class=row>
<div class=col-md-6>
</div>
<div class=col-md-6>
</div>

</div>For image tag we can use class=img-responsive to automatically fit into the grid.

To centre the background image use background:url(path without quotes) no-repeat centre
centre;

Background-size property
Bootstrap Default Button
<a class=btn btn-ng btn-default>

To remove the border use border 0px; style


For the div container if you want a page header for the container use <div class=page-
header></div> as shown below

When you have an unordered list and you want to remove the bullet points that appear
beside use the below code
.div ul{
list-style-type:none;
}
Another common confustion is when to use comma to saperate the elements in CSS see the
below example:
Div li{

} // This will style all the lis in the div.


Div li h2{
}// This will not style li. It will style all the h2s in the li.
Div li,h2{
}// This will style all the lis and h2s in the div

You might also like