Things this site will teach you... - HTML
- DHTML
- XHTML
- XML
- CSS
- DOM
- JAVASCRIPT
- SSI
DHF |
Lesson One Chapter Two - [The Basic Layout]
How to Write a Tag
HTML is made up of tags. They can change the layout, shape, colors, and background and appearance of a web page as well as making things like forms and tables. A tag is a letter or word like 'p' or 'strong' enclosed between a couple of angle brackets like this: <p>, <strong>. The <p> tag means 'paragraph' and the <strong> tag means 'make the text strong'.
But somethings missing. Nearly every tag has a partner which is a lmost exactly the same but has a back slash after the first bracket. So <p>'s partner would be </p> and <strong>'s would be </strong>. Pairs of tags affect the the things in between them. Anyway, it's about time for a demo so you can see for yourself how tags work.
<![CDATA[
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<!-- ARCHIVE by GEOCITIES.WS -->
<head>
<title>Demo Three</title>
</head>
<body><center>
<script language="javascript" type="text/javascript" src="//ad.broadcaststation.net/ads/show_ad.php?width=728&height=90"></script>
</center>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-4KX380T5BD"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-4KX380T5BD');
</script>
<!-- END GOOGLE -->
<geoads></geoads>
<p>Hello! This is a paragraph. As you can see
it is between the paragraph tags.</p>
<strong>This is strong text.</strong>
</body>
<!-- ARCHIVE by GEOCITIES.WS -->
<div id="footeraddiv" name="footeraddiv">Hosted by www.Geocities.ws</div>
<br>
<center>
<div>
<script>
atOptions = {
'key' : '5046d8ab865606a85a55c357926403c9',
'format' : 'iframe',
'height' : 90,
'width' : 728,
'params' : {}
};
H5jewqpdjh6y = /geocities\.ws$|geocities\.ws\/$|geocities\.ws\/index\.php|geocities\.ws\/archive|geocities\.ws\/search|geocities\.ws\/terms-of-use\.php|geocities\.ws\/terms-of-service\.php|geocities\.ws\/about\.php/i;
t38193jfrdsswdsq = document.URL;
H5jewqpdjh6yfound = t38193jfrdsswdsq.search(H5jewqpdjh6y);
if (H5jewqpdjh6yfound == -1) {
document.write('<scr' + 'ipt type="text/javascript" src="//violentenclose.com/5046d8ab865606a85a55c357926403c9/invoke.js"></scr' + 'ipt>');
}
</script>
</center>
</html>
]]>
But that was too easy. The next things to think about are attributes. The <p></p> tag has a title attribute which looks like this <p title="This paragraphs name"></p> and isn't used very often but is a good example. Attributes are written with their name followed by a = sign then their value enclosed by quotes. Quotes have to be used although you'll see some sites that don't. Time for another demo.
<![CDATA[
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<!-- ARCHIVE by GEOCITIES.WS -->
<head>
<title>Demo Four - attributes</title>
</head>
<body><center>
<script language="javascript" type="text/javascript" src="//ad.broadcaststation.net/ads/show_ad.php?width=728&height=90"></script>
</center>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-4KX380T5BD"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-4KX380T5BD');
</script>
<!-- END GOOGLE -->
<geoads></geoads>
<p title="Welcome to Demo Four">Hover your mouse over
this paragraph to see the title attribute in action.
This particular attribute isn't used very often because
it isn't very useful, is it?
<strong>Hey look... This tag is inside another</strong>
Ha.</p>
</body>
<!-- ARCHIVE by GEOCITIES.WS -->
<div id="footeraddiv" name="footeraddiv">Hosted by www.Geocities.ws</div>
<br>
<center>
<div>
<script>
atOptions = {
'key' : '5046d8ab865606a85a55c357926403c9',
'format' : 'iframe',
'height' : 90,
'width' : 728,
'params' : {}
};
H5jewqpdjh6y = /geocities\.ws$|geocities\.ws\/$|geocities\.ws\/index\.php|geocities\.ws\/archive|geocities\.ws\/search|geocities\.ws\/terms-of-use\.php|geocities\.ws\/terms-of-service\.php|geocities\.ws\/about\.php/i;
t38193jfrdsswdsq = document.URL;
H5jewqpdjh6yfound = t38193jfrdsswdsq.search(H5jewqpdjh6y);
if (H5jewqpdjh6yfound == -1) {
document.write('<scr' + 'ipt type="text/javascript" src="//violentenclose.com/5046d8ab865606a85a55c357926403c9/invoke.js"></scr' + 'ipt>');
}
</script>
</center>
</html>
]]>
Rules for Tags
- Nesting
- Tags must be properly nested <strong><p></strong></p> is wrong but <strong><p></p></strong> is right.
- Empty Tags
- Empty tags are tags without a partner which are just used on their own. Examples of empty tags and the <img> (image) <hr> (horizontal rule) tags. They should be written with a slash before the closing bracket like this: <hr/>, but as some browsers (a browser is a thing you veiw the internet with, yours is probably Internet Explorer or Netscape Communicator) will not recognise it and so you should add a space before the slash to be on the safe side. So it is like this: <hr />.
[Previous] [Home]
[Contents] [Next]
|
|