iT邦幫忙

2021 iThome 鐵人賽

DAY 2
0

What is HTML?

HTML Markup Language Elements

https://ithelp.ithome.com.tw/upload/images/20210911/20130362DrJTg4R13E.jpg

  • 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
<tr>
    <td>context</td> => a column
    <td>context</td>
</tr>
  • Adjust the border/width/height of a table <table border="1" width="600" cellpadding="5">

Notice

  • 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.
    https://ithelp.ithome.com.tw/upload/images/20210901/20130362Xh5ebxa1uq.png

https://ithelp.ithome.com.tw/upload/images/20210901/201303621gOJ35ZFkE.png

Final Design

https://ithelp.ithome.com.tw/upload/images/20210901/201303626MeJVC5xSN.png

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

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

Yes


Like/Share/Follow

If you guys find this article helpful, please kindly do the writer a favor — LIKE this article./images/emoticon/emoticon12.gif
Feel free to comment and share your ideas below to learn together!


上一篇
#1 Entry-Level Front-End Web Development
下一篇
#3 CSS Introduction x Foodie
系列文
Learn & Play JavaScript -- Entry-Level Front-End Web Development30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言