Jul 20, 2008

Html With Css - a easy look at CSS

Free Web Hosting, No Ads > CONTRIBUTE > Tutorials
Pages: 1, 2

free web hosting

Html With Css - a easy look at CSS

nickmealey
Cascading Stylesheets, or CSS, is a very easy way to spice up your web site. The thing I like about CSS, is it gives you a more extended version for styles. The <font> tag for example is very limited with what it can do. With CSS though, you can do numerous things. from mouseovers (a:hover) to just changing a simple paragraph tag to a fancy one.
there are two ways to incorperate the style sheet. the first one is to just put it inside your page:

CODE

<html>
<head>

<style>

all the stuff would go here
-
</style>


</head>

<body>



</body>
</html>




the second way is to link it to an outside source:

CODE

<html>
<head>

<link rel="stylesheet" type="text/css" href="/css/styles.css">

</head>


</html>




now, in css:

CODE

<style>

p {

color: blue;
font-family: "tahoma";
font-size: 15px;
}

</style>


 

 

 


Reply

googlue
Hi,
This tutorial is very useful for me.
I am using CSS for navigation menu in my site. I use the display: block css code. What are the other options other than block that I can use?
Can you also please elaborate more on different CSS styles?
Thank you
Googlue

Reply

guangdian
Css Make the Difference of All WWW web world.
Before the time I only know Frontpage I dont know CSS then I started to learn PageDesign It then come to a knowledge of css.It's about 1997.

Reply

rogan
QUOTE(googlue @ Mar 15 2005, 04:07 AM)
Hi,
This tutorial is very useful for me.
I am using CSS for navigation menu in my site. I use the display: block css code. What are the other options other than block that I can use?
Can you also please elaborate more on different CSS styles?
Thank you
Googlue
*


[B]If you want more css codes you can download Macroedia Dreamweaver MX 2004. That Program have everything.
Read this:

1*Basic page:
HTML,HTML TEMPLATE,LIBRARY ITEM,ACTION SCRIPT,CSS,JAVA SCRIPT,XML

2*Dynamic Page:ASP java script,ASP VB Script,ASP.NET C#, ASP.NET VB, Cold Fusion, Cold Fusion Component, JSP,PHP

3* Thay maded some exmples which you can chose!

If you cant find program a can give u a adress for downloading

Reply

mizako
Hi,
I do not know if you know about the CSS ZEN GARDEN project. This project really ilustrates what can be made with CSS.

Reply

bjrn
QUOTE(googlue @ Mar 15 2005, 04:07 AM)
I am using CSS for navigation menu in my site. I use the display: block css code. What are the other options other than block that I can use?

The other values for display depend on what element they are defined. For example
CODE
display: list-item
is only available to lists. W3Schools has a list of valid values.

If you want to learn more about CSS, I recommend reading through the W3Schools CSS tutorial. Which should be faster than downloading some software and going through its helpfiles.

Reply

doom145
this is a lame tutorial...tooo basic....any n0b who knows html would know this as its just another link just you change the tage name...LOl...not that hard.,..biggrin.gif

Reply

rogan
i try to create a css in macromedia drm. 2004 but when i strat that i only get a code,and i dont get the design sheet!
who is good in macromedia drm. 2004 mx?
i need help

Reply

Carsten
In addition to your tutorial and to make the markup code more valid, change <style> to
CODE
<style type="text/css">
. Average tutorial, you could explain more and go a little more indepth.

Reply

whyme
QUOTE(bjrn @ Mar 15 2005, 06:48 AM)
The other values for display depend on what element they are defined. For example
CODE
display: list-item
is only available to lists.  W3Schools has a list of valid values.

If you want to learn more about CSS, I recommend reading through the W3Schools CSS tutorial. Which should be faster than downloading some software and going through its helpfiles.
*



another way to do this is to use <li> and <ul> tags (XHTML only for <uL>)

So it would be something like this

CODE
<li><a href="blah.html">Blah</a></li>
<li><a href="blah2.html">Blah2</a></li>
<li><a href="blah3.html">Blah3</a></li>


then your css would be.

CODE

#li {
right-margin: 20px;
color: #999;
font-family: Arial;
}


this would space the links evenly across, with 20px spaces.

on a completely different note, i think that this tutorial is much too basic. need a lot of spicing up.

 

 

 


Reply

Latest Entries

clagnol
In response to Rogan's question:

QUOTE(rogan @ Mar 30 2005, 09:14 AM)
i try to create a css in macromedia drm. 2004 but when i strat that i only get a code,and i dont get the design sheet!
who is good in macromedia drm. 2004 mx?
i need help
*



There is a tab labelled "Design" in Dreamweaver MX which keeps track of all of the stylesheet rules for a given page. Right-click on it and select "New CSS Style". You can use CSS to create styles for any imaginable object, but for this example, I'll create a style for body paragraphs (that is, the text between <p> tags).

Now, you can either create a new class (which I'll explain shortly), redefine an html tag, or use a CSS selector (a:link, a:hover, a:visited, a:active).

If you define a new class, you'll want to give it a descriptive name preceded by a period, for example, ".body". To apply this style to a paragraph inside my main html page, I need only to type '<p class="body">'.

If you decide to redefine an html tag, simply select the <p> tag from the dropdown menu, and then all <p> tags within the html page will be affected by the new style.

And the CSS selectors merely affect link behavior.

Once you've chosen a style type, you must choose whether you are going to define your new style in the html page ("global"), or in a special CSS page ("linked"). There is a third option ("local") which consists of adding the CSS into the individual tags (like so: <p style="font-family: georgia, times new roman, serif">) but Dreamweaver will not help you with that, so you must actually learn CSS to use that method.

I think the rest is pretty self-explanatory. If anyone has any questions about CSS or design in general, feel free to ask me.

Reply

thebluekirby
isn't this tutural a little too basic?

anyways, it's pretty helpful ^__^ well... now i know that you can combine css codes in 1, lol (yeah, i didn't know that before tongue.gif)

Reply

Becca
i love css.. Been using it every since I knew html... it's the best... you can just make your own stuff up.
It saves a lot of space and time.... and it's really really really easy...

Reply



Got an Opinion! Express your Views! (no registration):-
Add your Reply/ Opinion/ Views/ Comments/ Suggestion/ Questions/ Queries etc.
Posts with decent grammar & English will be accepted and please refrain from profanities.
For asking a Question, We recommend you to sign-up (for free) so that you can track the topic easily.

Nature of your Post*: Opinion/ Reply/ Comments
Question/Query
Feedback to us.
       
Name   Email
Title/Question*

(Maximum characters: 10,000)
You have characters left.
Confirm Code:

Pages: 1, 2
Similar Topics

Keywords : html, css, easy, css

  1. Maplehosting - Reference System - 5% - Easy Money!
    Make the easiest money of your life (3)
  2. Add Flashing Inbox To Invisionfree Forum
    Html code for invsiionfree!! (0)
    Do you find it annoying when you are on your invisionfree forum, and you get a new message, and it
    ends up taking you 5 minutes to notice? This code makes the inbox link flash bold red saying how
    many messages you have. In version 1 the word inbox stays the same, and doesnt change at all (for
    Example this is flashing: Inbox (2) In version 2 (the second code) the word inbox changes to
    messages (constantly, so that if you have none, it says messages (0) instead of inbox (0). It still
    flashes Red Put the following In the Header and Body Section (Admin Cp>>>Skinning ....
  3. Recommended List Of Money Making Sites
    A list of 10 sites from which easy money can be made (0)
    I just want to let everyone know I have updated my list of money making websites and in my opinion
    the 10 listed are the most reliable and honest money making sites that are free to join available.
    Please review this blog and let me know what you think http://makeeasymoney247.blogspot.com ....
  4. A.w. Surveys
    Easy way to make money online! (4)
    Did you ever want to take surveys for money? But don't want to be hassled by scam sites? Then
    A.W. Surveys is for you! All you do is take web site evaluations, just write a three sentence
    summary of a site they link you to. Simple, right? Well it gets even easier! There is this
    referral part of the site, where you give your friends your link, they sign up under it and you get
    $1.25!! I got bored so I made this, it's also something good to put on your
    site's as ad's. *click here to sign up for A.W. Surveys, you're helping the site....
  5. What Is The Best Free Html Editor?
    (8)
    im looking for any kind that is free really.... i use windows but if you have one for a different
    platfor, go ahead and add it for reference for other users. If you have one for normal text editor
    and wysiwyg, add them both. i have been using notepad as my normal html editor but im looking for
    something different... at least so i can see the different colors of the codes. Right now i am
    downloading moxilla's seamonkey suite but im not sure how good it is... i will post a review if
    i ever use one. If you have used the html editor you suggest or you just heard abou....
  6. Html Problem
    (9)
    how to make my intro page in the middle not CENTER ....
  7. Flash Media Into Html/css Website
    does anyone know how to import a flash into a webpage with transparenc (1)
    Hi I need some help , Im designing this website for school studies However, I made a flash drop down
    menu, works perfectly, but you know how flash has a background when you export it in to a SWF file?
    For example my flash is width= 800, and height = 200 but my div box on my html page for my
    navigation is only 50 px my buttons is width of 50px and the rest of the content is the drop down
    animations i want to insert it into my navigation div box but i want to set the flash background to
    transparent so that when the drop down menu comes down it overlaps the text or whateva....
  8. Make Money Using Chacha
    very easy and legit (1)
    If anyone wants to become a guide at chacha.com; I have up to like 20 invites. give me your name
    and email and i'll invite the first 20 people. When I get more invites i'll invite more
    people. Here's some news articles about chacha:
    http://abcnews.go.com/GMA/TakeControlOfYourLife/ http://news.com.com/2100-1038_3-6109782.html ....
  9. Learn Html, Css, C And C++ Online For Free
    Wanna learn to write programs and/or make websites? You can do it fre (12)
    Have you ever used an application or played a game and thought, "If you could only..." or "If I knew
    how I would add..." but didn't know where to start? I did and decided to do a lil research. I
    came across a site with great tutorials. There are many ranging from beginner all the way to
    advanced. After each tutorial there is a test to practice what you just learned. I dunno if I am
    allowed to post the url to these sites here due to spam filters but I will say that if you search
    for "c programming" in any major search engine it should be the first link (after the....
  10. Will Software Development Be Easy One Day ?
    as in the case of website development ? (2)
    hey in todays world building a website is not a big deal , i guess there are so many ways to do that
    . Moreover nowdays there are other softwares that ennable you to buld a website. Those were the days
    when a website can be built only by peole who can do some codings , that is one must be knowing some
    mark up languages like HTML etc,inorder to create a website , Gone are those good old days , now
    even a person who does not even know what is HTML too can create a website of his/her own , the
    revolution in website creation is that the Macromedia which is now Adobes Dreamw....
  11. Html Form!
    Using MySQL?! (4)
    Hey, I need your help again! I need some good working tutorial how I can update my SQL through
    HTML form. I did use some tutorials online found with the help of google; but they do not work
    properly; I mean there are still small mistakes. I need to have a good tutorial to follow. It
    should be based on security and more things. It has to be done in proper way.......
  12. Has Anybody Tried Ms Expression Web Html Editor
    It's much better than Frontpage (3)
    I was desperate to finish a site I was designing after I lost my hard drive and my software. I
    downloaded Expression Web from the Microsoft site for a 3 month free trial, and guess what? It's
    surprisingly good! Nothing like that crappy frontpage, it's standards compliant and very
    good for writing CSS. Haven't heard anybody mention the program and wondering if anybody else
    has tried it out. It's free to try from the MS site.....
  13. An Easy Way To Get Soft Facial Skin.
    (8)
    I tried this, this morning. I mixed the following ingredients together. 1 lemon 2 spoonfulls of
    brown sugar 2 asprin Juice the lemon and then put the asprin in the lemon juice. This should
    soften the asprin to the point where it could be mashed up with a spoon. Then add the brown sugar.
    Stir thouroghly (or however you spell it) Then get a wash cloth and soak it in warm water. Then
    wipe your face down. Then soak the same washcloth in hot water, ring it out, and then lay it over
    your face for about 5 minutes. (to open the pores.) Then apply the mixture over oi....
  14. Where Is There A Good Site To Learn Web Html?
    (18)
    im a noob when it comes to web html to design web sites, can some one tell me where to find a good
    website that has good tutorials on how to use web html?....
  15. Post Your Favorite Easy To Make Meal.
    add ingredients and instructions (16)
    Heres mine =) TATER TOT HOTDISH Ingredients. A bag of tator tots. 2 cans of cream of mushroom
    soup (any cream soup can be substituted for optional flavor) 2 lb. of ground beef 1 can of corn (or
    any other desired vegetable(s)) Instructions. Cook the hamburger and strain the fat. Spread the
    hamburger into a baking dish then pour the soup and can of vegetables over. Stir until mixed well.
    Cover the mixture with tator tots and Bake for the amount of time it says for the tator tots to get
    done and add 5 minutes. (or until mixture is boiling and tator tots are crisped.)....
  16. Remembering Your Dreams
    An easy trick that really works. (9)
    So many people forget their dreams in the first few minutes after waking up, but there are some
    tricks to keeping then if you would like to try it. It takes some practice, but it really works.
    Anyway, it did for me. First of all, at night just before you go to sleep, tell yourself that you
    want to remember your dream. Try to think about that as you are drifting off. Then, just as you
    start to wake up. Do not open your eyes or move too much. Start immediatly thinking about the
    dream you just (hopefully) had. Run it back through you mind, try hard not to let any....
  17. Html Code Tester. Online Script
    (15)
    Yes, yes. I have another script that I have written and I am distributing. I am not entirely sure if
    this works. I have not tested it yet, but I will later and post back with a demo and fix it up.
    Current script: CODE <?php //Save this as something like htmltest.php function
    CheckForm() { $html_unsafe=$_POST['code']; //Gives us our user
    input $html_safe=str_replace("<?php"," ",$html_unsafe);
    //Starts security measures $html_safe=str_replace("?>","
    ",$html_sa....
  18. Help! Php Or Just Html?
    i want to start buliding my website. which is better, php or basic htm (13)
    i try to start this topic in webhost category but it seems like i cant. i dont have the permission
    so i just post my topic here. im sorry mod.. i want to build a website which contains: - Links to
    videos - Informations - photos - flash i don't know if i should use php or just HTML. guys,
    what are your opinions..??....
  19. Easy And Cheap Food Therapy For Fair Skin
    Recommended by Korean Actresses! (5)
    Did you notice that Korean actresses always have virtually flawless skin and fair skin? The
    following information was compiled from magazine and website interviews of Korean Actresses'
    methods of keeping their skin fair and soft. 1. Lee Young Ae's Black Tea Mask How: Place
    Black Tea bag, brown sugar and water together into a mug, as though you are preparing a cup of tea.
    Boil the mixture and allow it to cool to 37 - 40 degrees celsius. Add flour into the mixture and
    stir until it is even. Apply the mixture to your face. Cleanse your face after 15 minutes. ....
  20. Real Paying Site
    Easy and quick (7)
    That site really pays and I have recieved my first payment of 10 dollars. This is really easy not
    much of a big minimum payout and if you want you too can make money by just going here and signing
    up http://adbux.org If you want please do add me as a referrer as zak92 Thank you.....
  21. I Need Recipes That Are Easy And Very Quick To Make
    (25)
    Hey, I need recipes that are easy to make and fast. I work from home but am flooded with people all
    the time so I need to usually take off atleast 1 hour for those jerks /tongue.gif"
    style="vertical-align:middle" emoid=":P" border="0" alt="tongue.gif" /> as it goes for cooking and
    serving and junk. Help if anybody can, I am running out of recipes for my friends and family.
    Thanks a lot guys. I dont have the time to watch shows and as most of you can cook I will be happy
    about your recipes But I do not want any spamming here. Thanks....
  22. Invisionfree Skinning Tutorial * Skill Level: Easy
    So you want to skin invisionfree? (6)
    Welcome, I have made this tutorial because our forums are in desprate need of skinners.. program
    im using: gimp (im using this because its free, therefore we hopefully can get more skinners) how
    long it takes to make a skin? about 3 hours at best SIZES Maintitle - 750 x 29 px(or bigger)
    Titlemedium - 6 x 19 px Darkrow2 - 750 x 20 px Userlinks - 750 x 20 px (depends) Submenu - 750 x 29
    px (depends) Caldate - 106 x 21 px lets begin! first off lets go to
    http://www.invisionfree.com and register a board! name it wisely for your first skin. but you
    can alw....
  23. Steal Flash
    Easy? Too easy? (15)
    I do not like how stealing flash is so easy. I mean people do not even ask for permission anymore.
    It is so easy! I mean Cmon! I mean all you need to is get Firefox and boom steal anyone hard
    work! I some people like the people who made Ebaumsworld, just steal all of there content. I
    have tried to ask the creators if I could use there animations but they do not answer me so I take
    it. But it is the thought that counts right? I have heard something that protects it your site
    content from people like that is this true? Well I do not like how all sites are the s....
  24. Adding Rows & Columns In Html Table Using Javascript
    (1)
    I'm trying to create a website with a form that collects some user information to store in MySQL
    database. However, I've a problem when I want to dynamically add new rows and columns in the
    HTML table so that the user can add more information in the dynamically added textboxes. Here's
    what I have: CODE                  <table border="0" width="90%"
    align="center" id="itemsTable">                   <tr>
                       <td width="20%">                     Quantity                   
    <....
  25. Html Countdown For Your Wallpaper For Your Computer?
    (5)
    Can you have a HTML countdown for your wallpaper for your computer? I know you can have a animation
    wallpaper for your computer. But can you have a HTML countdown as your wallpaper? I want to use a
    HTML countdown for my wallpaper for my computer. So the wallpaper for my computer would be a HTML
    countdown. Can you/does anyone know how to put a HTML countdown for your wallpaper for your
    computer?....
  26. Google Adsense Exchange Engine
    easy way to much earnings (34)
    Hello, GUYZ! What do you think about my newest super idea? I want to create Google Adsense
    exchange engine for all!!! How it will be works? Well.... For example: YOU register in
    it's engine and this engine makes special page for YOU where YOU must input some sentenses with
    populated keywords and YOUR Google adsense CODE for any banner. Then other people register in this
    portal... Then YOU enter to YOUR account at this my engine. Click on special button and will be
    opened new window . Window opened randomly... It's window consist of some sente....
  27. Make Money In Megaupload.com Rewards.
    Pretty easy to win too! (15)
    Like i said, you can win money by using the free host server megaupload (megaupload.com). How to
    make money? Well, you just have to start using megaupload when you want to share a file with your
    friends, and then, deppending the amount of downloads of that file, you will also will win money,
    so, you just need to promote that file by sharing it in websites,forums,etc.., and when you have the
    number of downloads that megaupload say, you will then start wining money. For more information,
    and a better eplanation, visit megaupload.com and click the rewards button at the t....
  28. Rounded Edges In Photoshop
    An easy way to do this (13)
    I'll show you how to make rounded edges and a border around a picture. 1) Open you picture in
    photoshop. I'm chose this lovely picture to work with: 2)Select the elliptical marquee tool
    and make shore you keep these settings: 3) Use the elliptical marquee tool to draw a circle
    selection in one of the corners of your picture like this. Pick a size depending on how rounded you
    want your image. 4) Repeat this in every corner of your image until you have something like this.
    Try to make all the circles look as much alike as possible. 5) Now select the re....
  29. Does Anyone Know Where I Can Get A Free Html Maker
    (13)
    I was curious. There is a program clled dreamweaver which does what I want but it cost to much.....
  30. where did you learn html from?
    (84)
    HI, i am intresting in knowing where you began learning html of what inspired you to start learning
    html. which programs did you use or which progs dyu use?....

    1. Looking for html, css, easy, css

Searching Video's for html, css, easy, css
Similar
Maplehosting
- Reference
System - 5%
- Easy
Money! -
Make the
easiest
money of
your life
Add Flashing
Inbox To
Invisionfree
Forum - Html
code for
invsiionfree
!!
Recommended
List Of
Money Making
Sites - A
list of 10
sites from
which easy
money can be
made
A.w. Surveys
- Easy way
to make
money
online!
What Is The
Best Free
Html Editor?
Html Problem
Flash Media
Into
Html/css
Website -
does anyone
know how to
import a
flash into a
webpage with
transparenc
Make Money
Using Chacha
- very easy
and legit
Learn Html,
Css, C And
C++ Online
For Free -
Wanna learn
to write
programs
and/or make
websites?
You can do
it fre
Will
Software
Development
Be Easy One
Day ? - as
in the case
of website
development
?
Html
Form! -
Using
MySQL?!
Has Anybody
Tried Ms
Expression
Web Html
Editor -
It's
much better
than
Frontpage
An Easy Way
To Get Soft
Facial Skin.
Where Is
There A Good
Site To
Learn Web
Html?
Post Your
Favorite
Easy To Make
Meal. - add
ingredients
and
instructions
Remembering
Your Dreams
- An easy
trick that
really
works.
Html Code
Tester.
Online
Script
Help!
Php Or Just
Html? - i
want to
start
buliding my
website.
which is
better, php
or basic htm
Easy And
Cheap Food
Therapy For
Fair Skin -
Recommended
by Korean
Actresses
3;
Real Paying
Site - Easy
and quick
I Need
Recipes That
Are Easy And
Very Quick
To Make
Invisionfree
Skinning
Tutorial *
Skill Level:
Easy - So
you want to
skin
invisionfree
?
Steal Flash
- Easy? Too
easy?
Adding Rows
&
Columns In
Html Table
Using
Javascript
Html
Countdown
For Your
Wallpaper
For Your
Computer?
Google
Adsense
Exchange
Engine -
easy way to
much
earnings
Make Money
In
Megaupload.c
om Rewards.
- Pretty
easy to win
too!
Rounded
Edges In
Photoshop -
An easy way
to do this
Does Anyone
Know Where I
Can Get A
Free Html
Maker
where did
you learn
html from?
advertisement



Html With Css - a easy look at CSS



 

 

 

 

ADD REPLY / Got an Opinion! Remove these ADs! RAPID SEARCH! Free Web Hosting [X]
Express your Opinions, Thoughts or Contribute more info. to help others.
Ask your Doubts & Queries to get answers, So that "Together We can help others!"
Register FREE for AD-FREE forum, Create your own topics, Ask Questions, track topics, setup subscriptions & notifications and Get a Free Website w/ Email and FTP.
500MB Space *No Ads*, CPanel, FTP, PHP, MySQL, EMails - 100% FREE