Welcome to cheat sheet #1. I am writing this to review what I have learned about HTML, XHTML, and CSS. Most of this is syntax that I needed to write down to help me remember!
HTML and XHTML:
- Elements:
- Identify parts of HTML using tags
- Tags come in pairs, start with <tag> and end with </tag>
- Elements that insert something look like <tag … />
- Anchor Elements:
- Inline elements, typically used for links… <a href=”link”>text</a>
- You can use the target attribute to tell the browser how to display the link; target= “_blank”
- Attributes:
- Information about an specific element
- Located within a tag and specify a value and look like this: attribute=”value” and can be in any order
- Comments:
- Start with <!- – and end with – – >
- Tag examples:
- <head>, </head>; <body>, </body>; <hn>, </hn>; <p>, </p>;
<meta (name” “)…(content” “)/>; <title>, </title>
CSS:
- Separates style from the structure of a webpage and keeps the style of a website consistent
- They can occur on the page (internal) on in a text file (external) that has to be referenced using the <link rel(relative- resides on your site) or href (not on your site) /> or you can use
the @import “link”; after the <style> but before any style rule - Syntax looks like , selector {property: value;} and you can include more than one property with a value as long as they maintain the structure of property: value;
- Can create a style class and they are written like this: element.class attribute (if associated with an element) or .class attribute if not
- Inheritence. Parent elements find their way to child elements – if you say the in the body tag that the text is blue, it will be blue unless it is changed using inline style changes
CSS gives you control over a web page and the website. Most importantly it allows for consistency throughout a website without defining formatting in HTML or XHTML. Using style rules, I can define how I want my text to look once in CSS and not have to code it each time. You can write a .css file and reference it for every web page on a site. This theme has a .css file that determines how everything I type right now looks – not matter what computer I am on, what time of day it is, or where the text comes from – because of CSS I don’t have to make sure each post looks the same, it is done automatically.
For practice today I changed the color of <div class = “description”> to white on the each page of my blog – the previous color, grey, was hard to see. I found the class in the .css file and changed what I needed. No coding on the page itself and if I change the text, I won’t have to worry about formatting the new text to match. Fantastic!
I also checked the CSS on my company’s website. Now that I know how CSS works, the structure and syntax, and how to write CSS, selectors and declarations, it is easy to see how it was applied to the company website and how to define and maintain our brand in every page.
Dreamforce 2009 was an incredible time. I was lucky enough to meet and hang out with some great people – people who have inspired me to start this blog and teach myself more of what Salesforce.com can do and programming. I wanted to start this blog in the hopes that it will help other Salesforce users. I have learned a lot of information from reading other people’s blogs and twitter… it is my time to start sharing. Please feel free to comment on things to come – please let me know when I am wrong, when I could be doing things better, and even for the few times that I might be right! Without further ado…
Here is the list of the technology that I will start learning (in no particular order, yet):
HTML, XHTML, CSS, C++, Java, JavaScript, SQL, MySQL, PHP and APEX
First up – HTML, XHTML &CSS for Dummies (full color too!)
