PDA

View Full Version : How to draw simple lines?


Happyhelen
06-16-2005, 03:40 AM
Hi guys:

I know this is probably so obvious, but I'm new to DW and am an idiot trying to find how to just draw like a simple line across the page, but not having it as a box.

If you go here:

http://www.kennethfan.com/photography/portfolio.cgi ('http://www.kennethfan.com/photography/portfolio.cgi')

I'm trying to use that as a example of what I want. See how simple it is, with the lines as borders but not even touching? How do I just draw lines like that? It's just a striaght line but I can't seem to figure out how to do it on DW without using a table.

Thanks,
-Helen

Sloth_Boy
06-16-2005, 08:09 AM
well, you cant draw lines, that site you linked to, he is using images

vertical line ('http://www.kennethfan.com/Vblackdot.jpg')

horizontal line ('http://www.kennethfan.com/Hblackdot.jpg')

So, he has set those images to repeat as a background using CSS...

A horixontal rule is the only other way to get a horixontal line, its very simple code, just place a <hr> tag where ever you want a horizontal rule

Anyway, hope thats answered your question?

Cheers!!!

Jim_Shady
06-16-2005, 08:14 AM
Just a note... put your cursor where you want the line - and then do INSERT > HORIZONTAL RULE .

Shady.

domedia
06-16-2005, 01:13 PM
You should use <hr>, which by the way is the right semantic way of doing this. The tag was created for horizontal lines.

To make the <hr> appear as a thin line we style it with CSS: hr {
height: 1px;
border: 0;
color: #333;
background-color: #333;
width: 80%;
}

Put this CSS rule inside the <style> tag in your <head> area or put it in your external stylesheet.

Sloth_Boy
06-16-2005, 02:45 PM
would you need a dot infornt of that "hr" name (.hr)

So it'd be like this...

.hr {
height: 1px;
border: 0;
color: #333;
background-color: #333;
width: 80%;
}

will it still be recognised if it doesnt have the .dot before the CSS name

domedia
06-16-2005, 05:09 PM
dots are only used for css classes.

.hr {styles} would work for <tagname class="hr">

If you only want some <hr>'s to be a 1 px line I'd suggest something like this:
<hr class="thin">
hr.thin {
height: 1px;
border: 0;
color: #333;
background-color: #333;
width: 80%;
}

Sloth_Boy
06-17-2005, 12:46 AM
I thought you were talking about CSS,

thats all.

domedia
06-17-2005, 01:38 AM
I am talking about CSS. There's CSS rules based on tagnames, classes and id's.
Respectively:
tagname {styles}
.class-name {styles}
#id-name {styles}

Sloth_Boy
06-17-2005, 06:43 AM
oh, ok, makes sense