How to Make a CSS Code Banner
- 1). Open your website document in your computer's text editor application. Position your cursor before the closing </head> tag, and enter this CSS code:
<style type="text/css">
</style> - 2). Type "#banner { }" between the style elements to create a rule that makes your banner. Enter "height: ;" and "width: ;" and type a value in pixels (px) after each one to specify the preferred measurements. For instance:
#banner { height: 350px; width: 600px; } - 3). Enter "font-size: ;" and "font-family: ;" to create attributes that format your header's text. Type a pixel value after font-size, and enter two or three font names after font-family to specify the desired typeface. To illustrate:
#banner { font-size: 32px; font-family: "Times New Roman",Georgia,Serif; } - 4). Type "border-style: ;" and enter a pixel size, line style and hexadecimal color value to design the outline of your banner. Further, type "background-color: ;" and follow this with a preferred color value. For instance:
#banner { border-style: 4px dotted #f0f0f0; } - 5). Enter "padding: ;" followed by a value in pixels to specify the amount of space that shows between the content and the border of the banner. Your complete CSS code now looks similar to this example:
#banner {
height: 350px; width: 600px;
font-size: 32px; font-family: "Times New Roman",Georgia,Serif;
border-style: 4px dotted #f0f0f0;
padding: 15px;
} - 6). Enter "<div></div>" anywhere under the opening <body> tag where you want your header to display. Type your banner's text, such as the website title, between the div tags like so:
<div>
Type your banner's text here.
</div> - 7). Save your document.