CSS in web design..........whats the point? can someone please explain to me, in simple terms why they exist? Why are they better than HTML? If they are supposed to allow the web designer more control over the layout why do I always feel the opposite when I am using ready made templates? If on the other hand they enable a website designer to make all round specified design parameters how would I apply it to my site which unfortunately, as it has been built over the years ended up with different font sizes and line spacing on different pages……Is the a CSS tag I could put at the top of each page/main or table to override the other tags The site I am having problems with is www.libyantravels.com any advice to prevent me going mad would be appreciated but please keep it simple.........thanks
I think I understand your main problem, and you might not like the answer -
"Is the a CSS tag I could put at the top of each page/main or table to override the other tags "
The answer to that is no.
CSS applies the properties at the beginning of the page - anything you have inline (embedded) will override your css.
For example, if in your css you have :
body {color:Red;}
making the whole page have red text
but in your html you have
main Div
the blue text will override the css. Whatever is inline is 'king'.
You would have to go through each page and eliminate/minimize inline declarations and assign divs, tables, p's, h's, etc to classes and ids while beefing up your css to handle changes.
It might be a lot of work to accomplish, but once it is finished, your site maintenance will be incredibly easier.
CSS is an internal or External Style Sheet that is used to work WITH HTML4.0 or above to define the basic design elements of a web page. This is used because the Previous HTML versions had too many variable elements and it would take too long for a page to load, and with too many mistakes. All browsers accept CSS, so compatibility is not an issue.
If you are going to be using HTML and CSS I would recommend looking into using XHTML as well, which is the new wave of HTML, as it will eventually replace HTML.
Basically CSS or a Cascading Style Sheet, is what Internet Explorer (or any other browser) looks for to determine what the page will look like.
This is the order of operations for a style sheet being that #4 has priority:
1. Browser Default
2. External Style Sheet
3. Internal Style Sheet (inside the
tag)
4. Inline Style Sheet (inside the HTML Element)
an inline style would be something like This is a blue font.
If you have any other questions feel free to contact me.
Also if you want to know more, you can go to: http://www.w3schools.com/ and use their HTML CSS and XHTML tutorial to understand what you are looking for.
CSS stands for cascading stylesheet .. it basically has three components, internal, embedded, and external !
the internal is used in the main body .. for example if you wanted to open a paragraph and add some features to it you go code :
p { font-size:14 pt}
em { background-color:black color:white }
.class { color:red}
a:hover { text-decoration:overline background-color:yellow }
you use the embedded form to give features to the whole page by simply adding the features to the attributes from the beginning ..
the external is somehow similar to the embedded , the slight difference is that you should give the attributes in the notepad, then saving it as .css :
example:
p { font-size:14 pt}
em { background-color:black color:white }
.class { color:red}
a:hover { text-decoration:overline background-color:yellow }
save this as site.css
then you refer to the HTML page and add this tag to the head:
note that the location of the css file here is in the same place where the HTML file is ..
I Hope I Helped You Here .. I Had An Exam With These 3 days ago so the info is still fresh..
with HTML you put all of the styling inside each individual html element.. When using CSS you can define individually how each html element should be styled and then apply those styles to all of the html elements in the page.
If you use all html and then decide you want to change the page, you will have to change virtually every single html element. If you want to change the styling using CSS, you only need to change the CSS file.
CSS allows you to set various styles for html elements that can be reused across all of the pages of your site. You put the css in a file of its own and then reference it from all pages. This reduces the amount of code that you put on each page. Therefore, this results in smaller pages which allows them to load faster and more efficiently.
Also, using css for layout allows you to make only a few changes in the global css file, to have it affect all pages in your site. Imagine on each page of your site, let's say 20 pages, you have to edit the source code and change a bunch of properties like: margin, padding, top/left, position, or any other property. This takes a lot of time. If you use a global css file, you change it in one place and it affects all your pages.
Css is not in competition with Html - in fact css does not work without html. They work together. The issue is: do you define style in CSS or do you define it in HTML? Those are the options.
And the best answer seems to be a resounding: seperate style from data! Use css to define style and use html to define the data / info of a page.
So in your html you have a list - and you keep the html super clean and easy to read/edit/manage:
Item 1
Item 2
Item 3
Clean and simple right?
Then in a seperate css text file you have:
ul {
padding: 4px;
background-color: #efefef;
}
ul li {
padding: 2px;
border-bottom: 1px solid #666;
}
And so now in every page of your site you call in that css file.
So what happens? Every single page of your site that has
lists gets a list with a light gray background and a line divider under each list item. If you ever want to tweak that for the whole site you just change that one css file.
And css can control style for all types of things. It's pretty powerful.
2007-03-28 03:52:48
·
answer #6
·
answered by James H2
·
1⤊1⤋
There are so many things that you could do with CSS but not with HTML.
such as, you can change the words spacing, line spacing, make font size as big as you want, position your web content or images anywhere you want it, there are too many to list.
with HTML , you can't do that.
the most exciting about CSS is
1. Reduced bandwidth costs
2. A higher search engine ranking
3. Faster download speed
4. Increase in visibilities
5. User-centered design
6. Compatible with Mobile devices.
take a look of my website. you can't find any html table or
,
tags.
http://www.daypick.com
I created lots of CSS samples on my site. if you desire,
just copy and paste, then save it as extenal files.
then copy bellow code on each of your page between tag.
this code will tell the browser where to find "mylayout.css"
that's it.
if you want to change fond size or background color of your site. just modify your CSS files, It would apply to your entire website.
for example
body{
font-family:sans-serif;
font-size:16px;
background:lightyellow;
}
h1,h2,h3{color:blue; font-weight:bold;} /*### All "h1, h2, h3 tag" tag color will be blue and font-weight will be "bold" */
p{color:red} /*### All "p" tag color will be red ###*/
CSS allows you to modify the look and feel of your whole site without having to modify individual pages. Its really helpful if your website has many many pages.
all you need to do is call the CSS file in a tag at the top of your webpage.