William Harrel

Articles From William Harrel

2 results
2 results
Setting Up CSS in HTML

Article / Updated 03-26-2016

CSS is a style sheet language used to define the appearance and formatting of a document written in a markup language — often HTML. A style in this sense is a set of text-formatting instructions, such as font, color, size, and so on. Because CSS instructions exist separately from HTML code, you can apply the same set of instructions to every page in your website, or to more than one website. Here's a list of common HTML instructions used in conjunction with CSS: To link within HTML to an external style sheet, use the following structure: <span class="code"><head></span><span class="code"></span> <span class="code"> </span><span class="code"><link rel=</span><span class="code">"</span><span class="code">stylesheet</span><span class="code">"</span><span class="code"> type=</span><span class="code">"</span><span class="code">text/css</span><span class="code">"</span><span class="code"> href=</span><span class="code">"</span><span class="code">stylesheet.css</span><span class="code">"</span><span class="code"> /></span><span class="code"></span> <span class="code"></head></span><span class="code"></span> To embed styles within an HTML page: <span class="code"><style type=</span><span class="code">"</span><span class="code">text/css</span><span class="code">"</span><span class="code">></span><span class="code"></span> <span class="code"> </span><span class="code">styles ...</span><span class="code"></span> <span class="code"></style></span><span class="code"></span> Using a body style to design the overall page: <span class="code">body {</span><span class="code"></span> <span class="code"> </span><span class="code">margin:0;</span><span class="code"></span> <span class="code"> </span><span class="code">padding:8px 4px 12px 4px;</span><span class="code"></span> <span class="code"> </span><span class="code">color:#ffbf11;</span><span class="code"></span> <span class="code"> </span><span class="code">background:#000000 url(images/space.gif);</span><span class="code"></span> <span class="code">}</span> To use a class selector in HTML: <span class="code"><p class=</span><span class="code">"</span><span class="code">caption</span><span class="code">"</span><span class="code">>This is a caption paragraph</p></span> To use an ID selector in HTML: <span class="code"><div id=</span><span class="code">"</span><span class="code">sidemenu</span><span class="code">"</span><span class="code">> ...menu links... </div></span><span class="code"></span> Common type selectors: <span class="code">body {...}</span> <span class="code">p {...}</span> <span class="code">td {...}</span> <span class="code">ul {...}</span> Common class selectors: <span class="code">.caption {...}</span> <span class="code">.banner {...}</span> <span class="code">.main {...}</span> Common ID selectors: <span class="code">#mainParagraph {...}</span> <span class="code">#sidemenu {...}</span> <span class="code">#footer {...}</span>

View Article
Common HTML Tags

Article / Updated 03-26-2016

The following table lists some of the most common HTML tags that you'll use to build your website. After you've worked in HTML for a little while, these tags will become second nature to you. Tag Name Code Example > anchor href="http://www.yourdomain.com/">Click Here bold Bold Type body of document All of the contents of your Web page. line break Soft line breakSoft line break center Center your content font face="Times New Roman">Example form action="mailto:[email protected]"> Name: "Name" value=" size="10" /> heading 1 Heading 1 Example heading 2 Heading 2 Example heading 3 Heading 3 Example heading of document Contains elements describing the document hypertext markup language Title of your webpageWebpage contents <i> italic <i>Italic Typei> list item "i"> List item 1 List item 2 List item 3 List item 4 meta name="Description" content="Description of your site" /> name="keywords" content="keywords describing your site" /> ordered list List item 1 List item 2 List item 3 List item 4 paragraph This creates a line break and a space between lines. </span></td> <td>document title</td> <td><span class="code"><b><title></b></span><span class="code">Title of your webpage</span><span class="code"><b> unordered list List item 1 List item 2

View Article