制作iVX 低代碼項目需要進入在線IDE：https://editor.ivx.cn/

一、首頁內容分析

此時我們分析一下首頁內容：

通過以上內容可以得知，這些內容都統一包含在一個塊之內，這個塊之內包含了多個內容，這些內容主要是分為標題作者以及閱讀：

從我以上截圖可知，這個內容塊有一個內邊距，該內容創建一個行用于顯示標題，之后設置一個行，內容為作者和閱讀數，這兩個內容占據一行并不進行換行，在此右側的×我們并不進行考慮。

二、首頁內容制作

分析完畢后此時我們創建一個行，命名為內容，用于包裹所有內容塊：

接著設置這個內容塊的高度為包裹，高度將隨著當前內部內容的增加而增加：

你可能會疑問，為啥不設置內邊距？其實你可以統一在這里設置內邊距，但是我選擇在內容中設置內容，這樣我可以更清楚的看見這些內容適應于內邊距的樣子，又或者根本不用設置內邊距。

接著再到這個內容航中添加一個行，命名為博文，這個博文行就為每個博文內容進行顯示：

接著給與這個博文行背景色為白色，其他內容不需要進行改動：

此時再這個行中添加一個行，命名為標題，并且將其高度設置為包裹，背景色為透明：


接著更改這個標題行的寬度為 80%，然后設置整個博文行的水平對齊為居中，這樣不就可以自動有內邊距了嗎？


添加文本后效果如下：

此時設置一下文本大小，隨后加入文本后將會出現如下情況：

這是因為你并沒有設置該文本大小，你需要設置文本寬度為100%，意思就是跟當前的容器大小一致，這樣文本就會自動換行：

可是此時內容如果很多，就會發現有很多行，這樣并不例如我們有一個整齊的排版，所以咱們此時需要限制當前文本的顯示行數，此時在這個文本的屬性中找到最大行數，設置為 2 即可：

此時記得發現顯示多余內容時將會以省略號進行省略。

接著我們添加一個行，命名為信息：

接著調整對應的高度和背景色：

此時我們還需要設置一個很重要的屬性，那就寬度，否則這個部分的內容將會左對齊顯示，此時設置寬度小于父容器寬度后，由于父容器的水平對齊設置將會使整個行居中顯示，其內容也隨著容器變動：

接著在這個信息中添加兩個文本設置好大小和文本此時效果如下：

此時內容應該上下還有內邊距，在這里我們需要設置父容器博文的高度為垂直居中即可：

此時效果如下：

此時感覺距離左右兩邊太遠，并且上下距離太高，這沒關系我們進行調整后如下：

在設置閱讀數距離左邊的距離：

此時效果如下：

接著復制多個博文行查看效果：

此時效果總感覺怪怪的，少了原版的分割線和邊框：

此時有兩個方法，第一個是直接給與邊框，第二個是直接給與一個上外邊距，使其具有一定距離后將會顯示背景色，這樣就可以自動有邊框內容了：

效果如下：

方法有很多，主要是看大家選擇的方法。