今天要來介紹css很重要的一個部分：inline(行內元素),block（塊狀元素）,inline-block

第一個先介紹inline:

基本常見的行內元素：span a img input

．元素可在同一行內呈現，圖片或文字均不換行(水平排列)，也不會影響其版面配置
．不可設定長寬，元素的寬高由它的內容撐開

第二個：block:

常見元素：div p h1

．元素寬度預設會撐到最大，使其占滿整個容器（垂直排列,如有水平的需求，可使用flex)
．可以設定長寬/margin/padding，但仍會占滿一整行

最後一個：inline-block:

．以inline的方式呈現，但同時擁有block的屬性
．可設定元素的寬高/margin/padding
．可水平排列(inline方式）
簡單來說就是可同時擁有block可設定寬高的屬性，但其排版仍像inline屬性，並不會向右占滿整個容器。

資料參考：https://medium.com/@wendy199288/css%E6%95%99%E5%AD%B8-%E9%97%9C%E6%96%BCdisplay-inline-inline-block-block%E7%9A%84%E5%B7%AE%E5%88%A5-1034f38eda82