Presentation is loading. Please wait.

Presentation is loading. Please wait.

Remember, HTML is all about the meaning of your content Most HTML tags have built-in formatting that apply “meaning” to them and format their content.

Similar presentations


Presentation on theme: "Remember, HTML is all about the meaning of your content Most HTML tags have built-in formatting that apply “meaning” to them and format their content."— Presentation transcript:

1

2 Remember, HTML is all about the meaning of your content Most HTML tags have built-in formatting that apply “meaning” to them and format their content in a specific way (p makes a paragraph, h1 makes a heading…) Span and Div, however just facilitate more precise grouping of elements for more intricate formatting.

3 They are completely dependent on the formatting that you associate with them through CSS. With this first introduction, I just want you to understand these two tags as additional ways to group elements in HTML so that you can stylize them all together with CSS.

4 The difference between span and div is that a span element is in-line and usually used for a small chunk of in-line HTML A div (division) element is a block-line, which is basically equivalent to having a line-break before and after it. It is used to group larger chunks of code together.

5 Div and especially span should not be used that often There is usually a cleaner and easier way to do whatever you’re trying to do with div and span

6 Meta tags are not visible on a web page Their purpose is to allow search engines to catalog information about the web page This facilitates better standing for a webpage in search engine results

7

8 Meta tags can be used as many times as you like The primary attributes associated with HTML5 meta tags are content, name and charset The values related to the name attribute can be “description” “author” or “keywords” The values related to the content attribute can be a few things, but “content-type” is best. Don’t worry about http-equiv, that is from HTML 4.01

9

10

11 This is pretty close to what you learned in the Beginner tutorial

12 You will notice though, that the tags have been replaced with tags

13 is a standard data cell is a header cell, which comes with header formatting

14 “colspan” and “rowspan” are also new additions to the tags

15 These attributes merge cells in rows and columns

16 is a specific kind of list, similar to what you’ve already seen in the beginner tutorial with or The list items in this definition list are labeled first with (rather than ) This means definition term, and you can have as many of these as you like The definition term is followed by which means definition means definition description. You can have a number of these following for multiple definitions

17

18 Styling changes the look of content. Styling can be inline, internal or external Inline - style is an attribute defining a value within a tag: Internal - style is hidden in the document head as a tag containing CSS selectors, properties and values: p {font-size:20px; color:green} External - is just like internal, but separated out into a linked CSS file. More on that next class.

19 Inline - style is an attribute defining a value within a tag Internal - style is hidden in the document head as a tag containing CSS selectors, properties and values.

20 Common styling includes: font-family (caps-sensitive), font-size, color, background- color, text-align, strong, em Inline styling syntax: Internal styling syntax: selector {property:value; another-property:value}


Download ppt "Remember, HTML is all about the meaning of your content Most HTML tags have built-in formatting that apply “meaning” to them and format their content."

Similar presentations


Ads by Google