Borghunter 0 Report post Posted February 28, 2006 (edited) Welcome to a short Step-by-Step CSS tutorial I have made: Link to the CSS file in your HTML Document <head><link href=stylesheet.css type=text/css rel=stylesheet></head>Specify the object you want to use CSS in, for example, use the HTML "name" tag to create a variable, in this case we are going to use a text box <input type=text name=text1>Create the CSS document named "stylesheet.css"Color the background, font and font-family of the HTML document body {background-color: #000000;color: #FFFFFF;font-family: Arial, Verdana, Sans-Serif;}Color the text box (Period indicates name variable),(input is the type of tag you are using) input.text1 { background-color:transparent; border-top:0px; border-bottom:2px; border-right:0px; border-left:0px; border-color:#FFFFFF; border-style:dashed;}Test it out and see what happens, it's pretty neat! That is my short tutorial. More info on tags and other stuff at http://forums.xisto.com/no_longer_exists/ Edited February 28, 2006 by Borghunter (see edit history) Share this post Link to post Share on other sites
Tyssen 0 Report post Posted February 28, 2006 Quicker and easier, shorthand CSS: input.text1 { background-color:transparent; border: 2px dashed #FFF; border-width: 0 0 2px 0;} Share this post Link to post Share on other sites
Borghunter 0 Report post Posted February 28, 2006 It sometimes works, but Firefox is always picky. Share this post Link to post Share on other sites
Tyssen 0 Report post Posted February 28, 2006 What do you mean it 'sometimes' works? It works fine for all browsers later than v4. Share this post Link to post Share on other sites
Borghunter 0 Report post Posted February 28, 2006 FireFox, not IE.Please Make Sure You Read The Post Properly Before Responding!FireFox version is currently 1.5 Share this post Link to post Share on other sites
smartbei 0 Report post Posted February 28, 2006 (edited) Styles can also be used in a case by case basis, if you want to change the attributes of one object. For example, to set the color, size and font of the text inside a div: <div style="color:red; font:bold 15pt Arial Black;">Sample Text</div> And to set the placement of a div relative to the top left corner of a document (50 pixels from the left and 100 pixels from the top):<div style="position:absolute; left:50; top:100;">Sample Text</div> Edited February 28, 2006 by smartbei (see edit history) Share this post Link to post Share on other sites
Tyssen 0 Report post Posted February 28, 2006 FireFox, not IE.Please Make Sure You Read The Post Properly Before Responding!FireFox version is currently 1.5Don't construe your lack of understanding for me not reading properly. What I meant is that all browsers since versions 4 of IE & Netscape (so, in other words, years ago) have been able to understand shorthand CSS. Your claim that it 'sometimes' works is wrong - I use it all the time and my sites check out fine in Firefox, IE5-7 (including IE5/Mac*), Mozilla, Netscape, Opera, Safari, Konqueror and Camino.If you find it not working for you 100% of the time, you're doing something wrong.Oh and smartbei, using inline styles is as bad as using font tags - CSS is intended to separate presentation from content, and by using inline style, you're just doing the opposite.* The only browser I've come across that requires the long hand version of CSS is IE5/Mac when specifying left and right margins. Share this post Link to post Share on other sites
Lozbo 0 Report post Posted March 1, 2006 Nice starters tutorial, though you use obsolete html: <input type=text name=text1>Attribute values must be properly quoted, like type="text"...And all html tags must be closed:<link href=stylesheet.css type=text/css rel=stylesheet>Like this:<link href="styleseeht.css" /> Share this post Link to post Share on other sites
Tyssen 0 Report post Posted March 1, 2006 Lozbo, that's only if you're using XHTML doctypes. Share this post Link to post Share on other sites
Lozbo 0 Report post Posted March 1, 2006 Alright, so older html doctypes do not find this incorrect?Anyway i think we all agree that we must switch as fast as our posibilities allow us to xhtml and start producing a better markup. Share this post Link to post Share on other sites
Tyssen 0 Report post Posted March 2, 2006 For HTML 4 doctypes, it's actually invalid to have the trailing /.As far as rushing towards XHTML, some would argue that using an HTML 4.0 strict doctype is probably better than using one with XHTML 1.0 and serving your pages as content type text/html rather than the intended application/xhtml+xml. Share this post Link to post Share on other sites
