24
1 Minute HTML id and class with <style>

1 Minute HTML tutorial - id and class with

  • Upload
    rimaoka

  • View
    238

  • Download
    1

Embed Size (px)

Citation preview

Page 1: 1 Minute HTML tutorial - id and class with

1 Minute HTML

id and class with <style>

Page 2: 1 Minute HTML tutorial - id and class with

using id and class,

you can style elements

Page 3: 1 Minute HTML tutorial - id and class with
Page 4: 1 Minute HTML tutorial - id and class with

both is <h1> …

Page 5: 1 Minute HTML tutorial - id and class with

… but you can style

only the one you select

Page 6: 1 Minute HTML tutorial - id and class with

Let’s see how

id works

Page 7: 1 Minute HTML tutorial - id and class with
Page 8: 1 Minute HTML tutorial - id and class with
Page 9: 1 Minute HTML tutorial - id and class with

id is an attribute

Page 10: 1 Minute HTML tutorial - id and class with

Then you define

style for the id

Page 11: 1 Minute HTML tutorial - id and class with

style for an id

starts with “#”

Page 12: 1 Minute HTML tutorial - id and class with
Page 13: 1 Minute HTML tutorial - id and class with

Only the one with the id

has the style

Page 14: 1 Minute HTML tutorial - id and class with
Page 15: 1 Minute HTML tutorial - id and class with

Let’s see how

to use a class

Page 16: 1 Minute HTML tutorial - id and class with
Page 17: 1 Minute HTML tutorial - id and class with

Multiple elements

with the same class

Page 18: 1 Minute HTML tutorial - id and class with

Multiple elements can have

the same “class”, but….

Page 19: 1 Minute HTML tutorial - id and class with

only a single element can

have the same ”id”

Page 20: 1 Minute HTML tutorial - id and class with

Then you define style

for the class

Page 21: 1 Minute HTML tutorial - id and class with

style for a class starts with “.”

Page 22: 1 Minute HTML tutorial - id and class with

style for a class starts with “.”

(style for an id started with #)

Page 23: 1 Minute HTML tutorial - id and class with
Page 24: 1 Minute HTML tutorial - id and class with

Only the elements with the class

get the style applied