Introduction
In this blog entry I will be describing how HTML and its
purpose on developing a website, how CSS is used to develop a website and
compare the contrast between HTML and CSS and how they work together to develop
a website.
HTML
HTML stands For Hypertext Mark-Up Language. This is a
language describing web-pages using ordinary text. Every web page contains HTML
file, where the web browser converts the .HTML file into. Each file is just
text but with an .HTML extension it can be converted into a working web page if
you have the corrected tags for the web page.
HTML tags
Most tags have two parts, for example the start is a tag
like <html> and the closing tag will be the same tag but with a / in
front of it like </html>.
No closing tag
Some tags have rules for example you must have <img>
if you want to use images.
Every HTML files needs to have the basic tags for it to be
valid, so browses are able to read the HTML text, these tags are:
Tag attributes
Attributes allow you to customise a tag, an example of this
<img src=”image.jpg”>
Most attributes are optional for most tags and is mostly
used when you want to change something. Some tags need to be used to display
content and web pages properly.
CSS
CSS stands for Cascading Style Sheets and is used to
describe the look and formatting of a document in a mark-up language this
allows customization and improves the presentation of webpages. It is also used
to adapt to different devices, CSS can be used with HTML and makes it easier to
maintain.
Examples
The tag
<p> can be customized by adding CSS code for example
p
{font-style: italic}
By placing more
info you have now put that whole paragraph in Italic.
How HTML and CSS work together
Every webpage is viewed in a browser, what you see in your browser will
be a combination of structure, style and interactivity.
HTML is the structure of the webpage for example the paragraphs, lists
and images.
CSS Is there to communicate with the browser to tell the browser how the
content (HTML) should be displayed, for example different layouts for different
devices.
No comments:
Post a Comment