Placeholder Image

字幕列表 影片播放

  • 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>.

字幕與單字

單字即點即查 點擊單字可以查詢單字解釋

B2 中高級

HTML教程 - 07 - 圖片 (HTML Tutorial - 07 - Images)

  • 18 5
    Pan-Shy Gang 發佈於 2021 年 01 月 14 日
影片單字