[Learning]#2 HTML x Lovely Auntie

What is HTML?

HTML Markup Language Elements

  • opening/closing tags: e.g. <head> </head>
  • content: e.g. Lovely Auntie XD
  • attribute
    - <img src="file name.file type"> → an “empty element” contains no context
    - Inserting a hyperlink <li><a href="URL">context</a></li> → a “nesting element” with multiple tags

Commonly used

  • Set font size <h3>context</h3> → from h1~h6
  • Insert a hyperlink <li><a href="URL">context</a></li> → href =hypertext reference
  • Insert a picture <img src="file name.file type"/> → src = source. If it’s an “empty element,” you can also skip the latter tag.
  • Item List <li>
  • Designing a table
<td>context</td> => a column
  • Adjust the border/width/height of a table <table border="1" width="600" cellpadding="5">


  • Store the picture at the same place as your html file, and insert the name of the picture into your code.
  • If you want to edit in Chinese, you’ll have to set “Encoding” as “UTF-8,” and add as below blue mark to avoid garbled context.

Final Design

Resource: https://icdaniels.wordpress.com/tag/understanding-html-attribute/

Music of Today: laugh now cry later covered/same drugs by Joseph Solomon


If you guys find this article helpful, please kindly do the writer a favor — giving 5 clicks at the GREEN area and 10~50 claps at the bottom of this page.

Most important of all, feel free to comment and share your ideas below to learn together!



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Vida Lin

Vida Lin

PM, Relationship, Travel, or anything quirky but interesting.|Subscribe & buy Vida a drink @LikerLand, the bottom of each article. 在文章底下LikerLand訂閱、請Vida喝一杯飲料 ❤