HTML Tutorial


 /help/HTML Help Forum   FAQFAQ   SearchSearch   MemberlistMemberlist   RegisterRegister 
 ProfileProfile   Log in to check your private messagesLog in to check your private messages   Log inLog in 
RegisterRegister - Not registered yet? Got something to say? Join HTML Code Tutorial!
Quick Question About The Brackets
Goto page 1, 2  Next
Post new topic   Reply to topic    HTML Help Forum -> General HTML
View previous topic :: View next topic  
Author Message
AmyR9



Joined: 14 Sep 2008
Posts: 103

PostPosted: Tue Sep 29, 2009 11:02 am     Quick Question About The Brackets Reply with quote

I'm not a beginner or anything.
Just wanted to make sure I've been understanding things correctly all these years.
Are these brackets <> considered the tags?
Or is it just the letters or words we put in between them, like <p>, <body>, <img>?
So, in other words are p, body, and img the only things they are referring to as being tags, or is the brackets also parts of the tags?

Thanks,
Amy
sticks464



Joined: 31 Dec 2006
Posts: 2625

PostPosted: Tue Sep 29, 2009 12:28 pm     Reply with quote

You are correct in your assumption. The brackets are only required so browsers know that the contents are tags and not text.
AmyR9



Joined: 14 Sep 2008
Posts: 103

PostPosted: Mon Oct 19, 2009 6:02 pm     Reply with quote

Yes, but what exactly are you trying to say is not text? The brackets? < >
Because it seems the words body, title, and even the letter p, div, etc.. is all text.

Also, another thing I sometimes keep getting confused on too is I think I understand things and then a few things I don't know if I 100% understand like classes and id's. I read things that say that id's will usually have a # before the id's name, and classes have a period . before the class name. Also, things say that Id's can only be used once, but I see Id's typed out several times on pages. So, that is what I'm confused about.

Oh and another thing, I though Div was considered a tag, but sometimes I see the word div typed out with no brackets < > around it. So, how can that be?
Here is some of what I'm talking about below-
Code:

div.middle p {margin: 0 auto !important;}

And this here, you see how below it has id(#) twice-
Code:

#friendspace div.friend span.msProfileLink a span.pilRealName { color:#000; }
#friendspace div.friend span.msProfileLink a img.profileimagelink { padding-bottom:0px
sticks464



Joined: 31 Dec 2006
Posts: 2625

PostPosted: Mon Oct 19, 2009 7:56 pm     Reply with quote

I think your making this more complicated than it is.

Quote:
the words body, title, and even the letter p, div, etc.. is all text.

You are correct, IF used without brackets. Text inside brackets is considered a tag by browsers and is not displayed. Take away the brackets and browsers will display as text.

Quote:
Oh and another thing, I though Div was considered a tag, but sometimes I see the word div typed out with no brackets < > around it. So, how can that be?
Here is some of what I'm talking about below-

Code:
div.middle p {margin: 0 auto !important;}


And this here, you see how below it has id(#) twice-

Code:
#friendspace div.friend span.msProfileLink a span.pilRealName { color:#000; }
#friendspace div.friend span.msProfileLink a img.profileimagelink { padding-bottom:0px


Because these are css style rules that are contained within style tags.
Code:
<style type="text/css">
...
</style>
AmyR9



Joined: 14 Sep 2008
Posts: 103

PostPosted: Mon Oct 19, 2009 10:22 pm     Reply with quote

sticks464 wrote:


Because these are css style rules that are contained within style tags.
Code:
<style type="text/css">
...
</style>

Because what are the css style rules? Doesn't it have to have the opening style tag <style type="text/css"> before the stuff it has? and then </style> for the ending tag? I didn't see it typed there. So, looks like it's wrong way.
Code:
#friendspace div.friend span.msProfileLink a span.pilRealName { color:#000; }
#friendspace div.friend span.msProfileLink a img.profileimagelink { padding-bottom:0px

So, then in other words, for it to be correct, it would have to be
Code:

<style type="text/css #friendspace div.friend span.msProfileLink a span.pilRealName { color:#000; }
#friendspace div.friend span.msProfileLink a img.profileimagelink { padding-bottom:0px >Type the text we want here
</style>
sticks464



Joined: 31 Dec 2006
Posts: 2625

PostPosted: Tue Oct 20, 2009 4:10 am     Reply with quote

The style tags are use this way when embedding styles or putting style rules in the head section. If using an external style sheet then they aren't required since style rules wil be the only code on the page. If doing inline styles or putting a style rule in the html, only the opening style tag is used and it is in conjunction with the element being styled.

Sample of a style sheet
Code:
#friendspace div.friend span.msProfileLink a span.pilRealName { color:#000; }
#friendspace div.friend span.msProfileLink a img.profileimagelink { padding-bottom:0px


Embedded styles
Code:
<style type="text/css">
 #friendspace div.friend span.msProfileLink a span.pilRealName { color:#000; }
#friendspace div.friend span.msProfileLink a img.profileimagelink { padding-bottom:0px >
</style>


Inline styles
Code:
<div id="friendspace">
<div class="friend">
<span class="msProfileLink"><span class="pilRealName><a href="" style="color:#000;">John<span class="profileimagelink"><img src="john.jpg" style="padding-bottom:0px;"></a></span></span>
</div>
</div>


Good reference: http://reference.sitepoint.com/css
AmyR9



Joined: 14 Sep 2008
Posts: 103

PostPosted: Tue Oct 20, 2009 10:36 am     Reply with quote

I still do not know what I am doing wrong. The codes are already on the page. It is built into the software I use to make my sites with.
This is what I am not understanding what I am suppose to do any different. I have taken so many computer classes over the years, and this is the very first time external websites. I know what the term external means, and the files are all in the computer in folders.


On all the websites I have created over the years, my text, pictures, everything shows up just fine on my sites. That is why I am trying to find out, if I am doing something wrong, I would think nothing would show up on the page.

I have been all over to so many sites, and nothing seems to answer my questions as to what is wrong.
Just keeps repeating things I already know how to do. Like changing the fonts, the colors, all that. Depending on what software I'm using, it's built into it already. You choose from a list of the styles of fonts- Arial, Times New Roman, so many things to choose from.
Due to my health, I can't be typing all those codes out that the software does for us.

Also, yes, I see what you are saying about all the types of style sheets, but how do you know ahead of time what type of style sheets you are using?
I assume I'm using embedded since the codes are on my page already, but then I don't know since it has the codes in so many different ways. Inline, embedded, etc.. So, that is the only thing that is confusing.
sticks464



Joined: 31 Dec 2006
Posts: 2625

PostPosted: Tue Oct 20, 2009 11:30 am     Reply with quote

Your probably not doing things wrong that would make your designs break. Maybe your doing thing incorrectly that would make editing and updating harder than it should be.

When using inline style, the method should be reserved for 'one time occurances' on one page.

Embedded style are fine if there are only one or two pages but when you start getting more pages it makes editing a hassle since each page would have to be edited because a lot of your styles would be repeticous. Using an external stylesheet enables you to edit one style to make changes on multiple pages.

Sounds like you mostly use templates that someone else has created and edit it to suit your needs.

I create my own template with embedded css and once I am satisfied with the layout I transfer the css to an external stylesheet which I link to the template. I can then copy the template code and paste it onto a new page. Then just adding content for the new page is easy and there are no repetitive styles to enter into the head section.

If your software does auto complete and code suggestions the you can do code and styles without any extreneous typing, just click and it is entered.

The last site I did had eight external stylesheets, seven of them imported into the main stylesheet. It makes editing the menu, slideshow, sidebar, header, footer and main content easy without having to hunt through a very long page for the style I want to edit/update.

If your method work easily for you and your pages render correctly with valid code, then I wouldn't change anything. But if your looking for ways to speed up your work and still produce valid markup and css then look to external stylesheets.
AmyR9



Joined: 14 Sep 2008
Posts: 103

PostPosted: Thu Oct 22, 2009 11:19 am     Reply with quote

Thank you very much. Your explanation helps me feel a little better that my sites wont just blow up one day.

The only reasons I'm doing websites is because I enjoy making things and also I've discovered I can help others out too(by putting links for their sites on mine, which helps give them free advertising especially if their sites are for their job and helps others to find more information on the topic they are looking for information about). I'm not doing sites for a job or anything like that. Due to more than 1 chronic illness I have, I will never be able to have a job.

The software I use is just like any other software mostly. You type the document out and same as like this thing here, the stuff above that you can make text Bold, Italics, Underline, things like that you can do, and choose different font styles like Arial, etc.., color for the text, stuff like that I enjoy doing and the background of the page I get to design myself.
Also, some people keep trying to tell me some false information, like telling me my software doesn't do CSS, but it does do CSS. Here is what I'm talking about- "About attaching cascading style sheets
You can use Microsoft Word to attach, remove, and manage cascading style sheets (CSS) (cascading style sheets (CSS): The part of a Web page that defines styles that control the way a Web page or a part of a Web page appears in a browser. Microsoft Office stores embedded style sheets at the top of each Web page.) for Web pages. Cascading style sheets provide a convenient way to format several Web pages or a whole Web site. To change the format of the pages, you can make changes to the style sheet without having to edit each Web page.

You can use Word to attach more than one style sheet. For example, you might have a style sheet that's part of a large Web site, such as one for a university, and then another style sheet that defines a smaller group of related pages, such as one for a department within the university.

You can also determine which style sheet takes precedence over another, in case conflicting styles are defined for the same elements.

When you attach a style sheet to your Web page in Word, the styles will appear in the Styles and Formatting task pane (task pane: A window within an Office application that provides commonly used commands. Its location and small size allow you to use these commands while still working on your files.).
"

I'm still not 100% if I understand what you are referring to when you say inline styles for one time occurances. Could you explain what you are talking about would occur 1 time or give me an example of what would happen 1 time?
I assume things are rendering correctly with valid code. If it wasn't correct, I don't understand why people are able to see the text that I have typed out onto the page, and the pictures I put on my page, and whenever I put links for peoples websites on mine, it goes to the site when you click on the link.
When you say auto complete, are you talking about filling out a form? I guess when I think of the term auto complete, I thought its only for remembering information you previously entered.
sticks464



Joined: 31 Dec 2006
Posts: 2625

PostPosted: Thu Oct 22, 2009 1:25 pm     Reply with quote

Without getting into a long lengthy debate, just let me say Microsoft Office products are not for designing web pages. There are too many free html editors that will do what Microsoft Office products do and better.

How should stylesheets look?
Here's an example of one I just did (partial)
Code:
@charset "utf-8";
/* CSS Document */
@import url("css-reset.css");
@import url("featured.css");
@import url("main_menu.css");
@import url("facebox.css");
@import url("ibox.css");
@import url("prettyPhoto.css");
@import url("form.css");
body {
   font: 65.5%/1.5 Verdana, Arial, Helvetica, sans-serif;
   background: #73a2c8;
   text-align: center;
   color:#333;
}
#container {
   width:900px; /* any width including 100% will work */
   margin:0 auto; /* remove if 100% width */
   background:#FFF;
   position:relative;
   text-align:left;
   -moz-box-shadow: 2px 2px 10px #000;
   -webkit-box-shadow: 2px 2px 10px #000;
}
#header {
   width: 100%;
   background:#e15e27;
}
h1 {
   height:270px;
   width:100%;
   position:relative;
   font-size:48px;
}


If you do not require all the additional stylesheets then the imported ones aren't necessary.

Quote:
I'm still not 100% if I understand what you are referring to when you say inline styles for one time occurances. Could you explain what you are talking about would occur 1 time or give me an example of what would happen 1 time?


If you have a global style that affects all element that are the same (I'll use a paragraph for example) you may want to change just one occurance of a paragraph on a certain page

Global style for paragraphs (with a little exaggeration)
Code:
p {
font-style: italic;
font-weight: bold;
letter-spacing: 2px;
word-spacing: 5px;
color: #f00;
text-indent: 10px;
}


Now to make one paragraph different with inline styles

Code:
<p style="font-style:normal; font-weight:normal; color:#000;">This text is different from any other.</p>


Quote:
When you say auto complete, are you talking about filling out a form? I guess when I think of the term auto complete, I thought its only for remembering information you previously entered.


No, not the same thing. My html editor will give me 'hints'. If I type in the letter 'f' a box will open giving me all the options beginning with that letter. I can then choose which option I want to use or I can continue manually typing in what I want.
If I am closing a tag say for a paragraph, all I have to type is '</' and it will automatically complete it for me with 'p>'.

Here's an example of code Microsoft Office can put in that is completely unnecessary

Code:
<w:WordDocument>
  <w:SpellingState>Clean</w:SpellingState>
  <w:GrammarState>Clean</w:GrammarState>
  <w:TrackMoves/>
  <w:TrackFormatting/>
  <w:PunctuationKerning/>
  <w:ValidateAgainstSchemas/>
  <w:SaveIfXMLInvalid>false</w:SaveIfXMLInvalid>
  <w:IgnoreMixedContent>false</w:IgnoreMixedContent>
  <w:AlwaysShowPlaceholderText>false</w:AlwaysShowPlaceholderText>
  <w:DoNotPromoteQF/>
  <w:LidThemeOther>EN-US</w:LidThemeOther>
  <w:LidThemeAsian>X-NONE</w:LidThemeAsian>
  <w:LidThemeComplexScript>X-NONE</w:LidThemeComplexScript>
  <w:Compatibility>
   <w:BreakWrappedTables/>
   <w:SnapToGridInCell/>


A good list of html editors and wysiwyg editors can be found here.


Last edited by sticks464 on Thu Oct 22, 2009 1:59 pm; edited 1 time in total
AmyR9



Joined: 14 Sep 2008
Posts: 103

PostPosted: Thu Oct 22, 2009 1:43 pm     Reply with quote

Then I give up. I just want to kill myself.
Why do some people keep trying to tell us that Microsoft Office will not create web pages?
If it doesn't, then why in the classes I took, we used all those programs?
I have been creating all my websites using these programs, so I don't know why I need to run out there and do something I can't do, such as typing all those codes out that you are typing? Due to my disabilities, I can not sit here typing those brackets like you are having to do with your editor. The program automatically puts them there. Like if you want to put a table on the page, you click on the table thing, same for paragraphs, you just type the paragraph. The words and sentences of the paragraph you type and any punctuation you type, periods at the end of a sentence.
People are able to see my sites just fine. They can see the pictures, the text. So, this is what I do not understand. If I am doing something wrong, then why are people able to see things I have put on the site just fine?
I also was just watching QVC last night and they were selling a computer, and this lady called in who was talking about her job. They said to her that with Microsoft Office she can create a site for her job.
Also, why do they have all these tutorials all over the place too about how to use Microsoft Word, and everything else to create web pages with?
Plus just recently when signing up for an account on Angelfire, they will only allow me to use Microsoft Word or their editor. They wont allow anything else. I had to choose when I signed up if I want to use their editor or Microsoft Word was the other option. Nothing else.
Plus since I'm using my mom's computer for a lot of things too, some things that people tell me to do, I can not do. She doesn't want me to get the software since we already have stuff right here that works just fine.
Some things that people keep telling me too also I'm wondering if I can even do some of the things because of devices I don't even have. Like it says CSS for mobile devices. I don't have a mobile phone, iphone, cellphone, tv tuners in computer, laptop, any of those things. All we have is just a plain desktop computer.
sticks464



Joined: 31 Dec 2006
Posts: 2625

PostPosted: Thu Oct 22, 2009 2:08 pm     Reply with quote

Quote:
Then I give up. I just want to kill myself.


That's not the answer I expected. If your sites work and can be seen then your 90% of the way there. The other 10% is good code that all browsers can display correctly.

Do me a favor, write a simple web page using word, post it here and we'll go from there as to whether you need to change or continue with word.

There are free editors that will do exactly what word does, but without the extra word code.
AmyR9



Joined: 14 Sep 2008
Posts: 103

PostPosted: Thu Oct 22, 2009 2:56 pm     Reply with quote

Do you think I am just beginning to create websites or something?
I already have millions of websites out there already.
I also have several at Angelfire, Geocities which is now leaving, but I have over 50 or so that a friend of mine just helped me get backed up.

Here is one of them which I was helping my sister and her husband with a year ago before getting sick and I had to quit due to other reasons problems with my computer not working right due to spyware, and so many other things, so is now paying someone, but here is the address so you can see-
http://www.astresurfacing.com/index.html
AmyR9



Joined: 14 Sep 2008
Posts: 103

PostPosted: Thu Oct 22, 2009 3:24 pm     Reply with quote

If you want to see my very first website which I created back in the 90's, here it is-
http://www.angelfire.com/fl/JTT99/

If I go to the guestbook I have on it, and I have guestbooks on like on my other sites I've made, I see the comments people wrote, and that is one way I know people seem to be able to see things just fine. They say things like it's one of the best sites out there.

But anyways, you can see what I'm talking about when I say how I like creating things. You will notice how I have the colorful stars background, and then you will see how I have different colors for text/words.
sticks464



Joined: 31 Dec 2006
Posts: 2625

PostPosted: Thu Oct 22, 2009 3:51 pm     Reply with quote

There is no extra code on that site if it was created with word.
However there are some incorrect usage of tags that can be improved. Use the w3c validator for all code and css. Use this reference to find correct usage and examples of html and css usage.

xhtml is case sensitive and must be written in lowercase.
Display posts from previous:   
Post new topic   Reply to topic    HTML Help Forum -> General HTML All times are GMT - 8 Hours
Goto page 1, 2  Next
Page 1 of 2

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
HTML Help Archive
Powered by phpBB © 2001, 2005 phpBB Group
HTML Help topic RSS feed 

 
DARFUR
HOSTING / DESIGN
MAKE MONEY

Home
  |   Tutorials   |   Forum   |   Quick List   |   Link Directory   |   About
Copyright ©1997-2002 Idocs and ©2002-2007 HTML Code Tutorial