Placeholder Image

Subtitles section Play video

  • To include an image into our web page we use the image tag <img>.

  • This tag requires the source attribute (src) to points to the location of the image, which

  • can for example be in the JPG, GIF or PNG format.

  • Another attribute that we should include is alt, for alternative description. If for any

  • reason the image can't be displayed this text will be shown instead.

  • We can resize the image by adjusting the width and height, specified in either pixels or

  • a percentage of the page.

  • Title is a generic attribute that can be applied to almost any element. For the image tag it

  • will provide a tooltip when the mouse hovers over it.

  • Next, we have four deprecated attributes. The border attribute sets the thickness of

  • the border. As with other elements able to use a border we should set its value to zero

  • if we don't want it to be shown since this is not the default for all browsers.

  • The horizontal (hspace) and vertical (vspace) space attributes simply add spacing to the

  • sides of the image.

  • The alignment attribute (align) appears on several different elements, but no other element

  • have as many values as the image tag does. Let's take a look at some examples.

  • The default alignment is bottom, which is equivalent to baseline. They both align the

  • image to the bottom of the text. Middle aligns the image to the middle of the baseline and

  • texttop aligns it to the top of the text.

  • Next, we have some values that aligns the image with any elements on the line instead

  • of only with text. Absolute bottom aligns the image with the lowest part of the line.

  • Absolute middle is equivalent to center and aligns the image with the middle of the line

  • and top aligns it with the top of the line.

  • As for horizontal alignment, we have the values right and left, which both moves the image

  • down one row and cause the text to flow around it.

To include an image into our web page we use the image tag <img>.

Subtitles and vocabulary

Click the word to look it up Click the word to find further inforamtion about it

B2 image attribute tag alignment border middle

HTML Tutorial - 07 - Images

  • 39 0
    Pan-Shy Gang posted on 2015/01/26
Video vocabulary

Keywords

equivalent

US /ɪˈkwɪvələnt/

UK /ɪˈkwɪvələnt/

  • adjective
  • Having the same effect or meaning.
  • Having the same meaning or significance.
  • Equal in value, amount, meaning, or function.
  • Equal to something in value, use or meaning
  • noun
  • A thing that is equal to or corresponds with something else.
  • Thing like another in quality, quantity or degree
  • A person or thing that is equal to or corresponds with another in value, amount, function, meaning, etc.
simply

US /ˈsɪmpli/

UK /ˈsɪmpli/

  • adverb
  • In an easy or clear manner
line

US /laɪn/

UK /laɪn/

  • noun
  • Border that divides two places or regions
  • Long crease in the skin, often from age
  • Mark that is long, straight and very thin
  • Row of words, letters or numbers that are written
  • Telephone connection
  • People waiting one behind the other; queue
  • Long thin wire, e.g. for electrical signal
  • verb
  • To put material along the inside of something
align

US /əˈlaɪn/

UK /əˈlaɪn/

  • verb
  • To arrange (e.g. objects) in line with one another
  • other
  • To adjust something so that it is in the correct position or direction.
  • To arrange things so that they form a line or are parallel to each other.
  • To agree with or support a particular idea, group, or person.
  • other
  • To be in a line or in the correct position in relation to something else.
  • To give support to a person, organization, or cause.
show

US /ʃo/

UK /ʃəʊ/

  • verb
  • To be easily seen or displayed
  • To display your emotions or feelings
  • To let someone see something; display
  • To explain or teach how something is done
  • To lead someone somewhere; point them to something
  • To prove something to be true, correct
  • To reveal or allow something to be seen
  • noun
  • False display of love, emotion or action
  • An event for displaying or promoting goods
  • Play, opera or theater production
  • Presentation that is broadcast on TV or radio
text

US /tɛkst/

UK /tekst/

  • other
  • To send someone a text message.
  • verb
  • To send a message by phone or other device
  • noun
  • Any form in which writing exists
  • The words of a song.
  • A short written message sent using a mobile phone.
  • Reading or audio passage, often a story or article
  • A book or other piece of writing, especially one used for study.
  • Written part of a book or other work
  • other
  • The main written material in a book, magazine, etc.
bottom

US /ˈbɑtəm/

UK /'bɒtəm/

  • noun
  • The part of your body you sit on
  • A person's buttocks.
  • The base of a container.
  • Lowest position, often in a company or contest
  • The lower end of something, especially a page.
  • The reason or support for something; foundation.
  • (In male homosexual activity) the receptive partner.
  • A person's buttocks.
  • Lowest part of something; part on which it rests
  • The lowest part or edge of something.
  • Lowest level, part or point of an object
  • The lowest rank or position in a hierarchy.
  • The part of a ship that is normally under water.
  • The ground under a body of water.
  • The bed of a river or stream.
  • The passive partner in anal sex.
  • The part of a garment that covers the buttocks.
  • The part under something, e.g. a vase
  • other
  • To reach the lowest point.
  • To provide with a bottom.
  • adjective
  • Lowest in rank or position.
  • Concerning the part under something, e.g. a vase
  • verb
  • To hit the lowest part of something
middle

US /ˈmidl/

UK /'mɪdl/

  • adjective
  • Equal distance from extremes
  • At an equal distance from the extremities; central.
  • noun
  • Place that is halfway between two things
  • The point or position at an equal distance from the sides or extremities of something; the center.
  • The part of the human body around the waist.
element

US /ˈɛləmənt/

UK /'elɪmənt/

  • noun
  • A substance that cannot be broken down into simpler substances by chemical means.
  • A basic part of something.
  • A distinct part of a whole, especially in a computer system.
  • A situation or environment that suits someone well.
  • Essential or particular part of something
top

US /tɑp/

UK /tɒp/

  • verb
  • To be higher or larger than a specific value
  • To arrive at the highest point of something
  • To be more or better than (something).
  • To put a cover or layer or over something
  • To kill; murder
  • To hold the highest position on a list
  • To be higher than (something else).
  • To be more important, successful or better than
  • To beat someone or win at a game
  • other
  • To put something on the top of something else.
  • To exceed or surpass.
  • To remove the top of something.
  • adjective
  • Best; most excellent.
  • The dominant partner in a sexual relationship.
  • Being good or great; excellent
  • In charge; in command.
  • Highest in position, rank, or importance.
  • Being the most in degree or quality
  • noun
  • Item of clothing covering shoulders to waist, hips
  • An item of clothing for the upper part of the body.
  • A lid or cover for a container.
  • A cover or lid
  • Part (e.g. road) that is the furthest away
  • Highest or upper part or point of something
  • Marijuana.
  • The highest rank or position.
  • A toy that spins on its point.
  • Best or highest status or position
  • The upper surface of something.
  • Flat upper surface or edge of an object
  • Child's toy that spins on its point
  • Upper section or leaves of fruits and vegetables
  • Winning in a sport or contest
  • other
  • To reach a maximum speed or level.