 |
|
|
| View previous topic :: View next topic |
| Author |
Message |
AmyR9

Joined: 14 Sep 2008 Posts: 103
|
Posted: Tue Sep 29, 2009 11:02 am Quick Question About The Brackets |
|
|
|
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
|
Posted: Tue Sep 29, 2009 12:28 pm |
|
|
|
| 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
|
Posted: Mon Oct 19, 2009 6:02 pm |
|
|
|
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
|
Posted: Mon Oct 19, 2009 7:56 pm |
|
|
|
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
|
Posted: Mon Oct 19, 2009 10:22 pm |
|
|
|
| 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
|
Posted: Tue Oct 20, 2009 4:10 am |
|
|
|
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
|
Posted: Tue Oct 20, 2009 10:36 am |
|
|
|
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
|
Posted: Tue Oct 20, 2009 11:30 am |
|
|
|
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
|
Posted: Thu Oct 22, 2009 11:19 am |
|
|
|
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
|
Posted: Thu Oct 22, 2009 1:25 pm |
|
|
|
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
|
Posted: Thu Oct 22, 2009 1:43 pm |
|
|
|
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
|
Posted: Thu Oct 22, 2009 2:08 pm |
|
|
|
| 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
|
Posted: Thu Oct 22, 2009 2:56 pm |
|
|
|
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
|
Posted: Thu Oct 22, 2009 3:24 pm |
|
|
|
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
|
Posted: Thu Oct 22, 2009 3:51 pm |
|
|
|
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. |
|
|
|
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
|
|
|
|
|