作者簡介

作者名：1_bit
簡介：CSDN博客專家，2020年博客之星TOP5，藍橋簽約作者。15-16年曾在網上直播，帶領一批程序小白走上程序員之路。歡迎各位小白加我咨詢我相關信息，迷茫的你會找到答案。系列教程將會在流量降低時轉為付費位置，流量多時將不會，各位抓緊時間學習喲~

什么是低代碼？什么是 IVX

👸小媛：bit 哥，我學了很多東西，例如 php、java、html之類，可是都做不了一個應用怎么辦？

🐶1_bit：你是指什么應用呢？

👸小媛：網站、小程序、小游戲之類都不會做。 😨

🐶1_bit：那是因為你需要多鍛煉呢，這樣才能有一定的經驗去完成一些項目的開發。

👸小媛：啊！感覺時間好長啊，代碼太難了。 😖

🐶1_bit：其實不難的，但是需要有一個鍛煉過程積累經驗。

👸小媛：那有沒有好一點的方式呢？我想快點學會制作這些東西。

🐶1_bit：有呀，現在的低代碼就可以完成；低代碼技術隨著不斷迭代，越來越好使，可能之后會是一種趨勢，想要學一下嗎？

👸小媛：啥是低代碼？

🐶1_bit：就是用少量代碼，或者是不用代碼去完成一個項目的制作。

👸小媛：哇！這么厲害！？趕緊教我，我想試試。 😅

🐶1_bit：哈哈哈，正好最近接觸一個好東西，叫做 IVX，你可以通過畫圖制作界面，并且可以一鍵部署，完成網站、小程序、小游戲之類的應用喲。

👸小媛：哇！這么厲害？！那什么是部署呢？

🐶1_bit：因為你做好一個應用后，需要給大家玩，就需要放到服務器上，對于新手來說可能就很麻煩，你通過 IVX 進行制作，就少去了這些步驟，而且又簡單，完全省去了代碼編寫呢。我們今天就初步學一下，使用 IVX 做一個精美 Web 端簡歷吧。

👸小媛：啊！等不及了，趕緊教我吧。 😋

絕對定位布局

🐶1_bit：好勒，但是在正式制作項目前，我們得需要了解這個 IVX 的用法；由于 IVX 功能強大，所以我們還需要學一些功能方便我們之后進行應用開發。

👸小媛：沒關系，能夠省去打代碼就可以了。

🐶1_bit：我們可以先進入 IVX 的官網，因為 IVX 是一個在線的開發平臺，我們完全不需要配置任何環境，直接進入網址就可以進行開發了呢。

👸小媛：那 bit 哥趕緊給我網址吧。

🐶1_bit：你點擊這個網址進入吧 https://editor.ivx.cn/ 。

👸小媛：注冊完了，然后我點立即體驗出現了這個區域，我該如何選擇呢？

🐶1_bit： 那我們先創建一個絕對定位的一個 WebAPP 、小程序應用吧。你選擇絕對定位進行創建就可以了。

👸小媛：哇，出來了一個界面，接下來怎么做呢？

🐶1_bit：這個時候我們記得選中前臺，也就是下圖藍色框框選位置，隨后我們可以看到左側黃色框框選位置的藍色按鍵就是組件。

👸小媛：那什么是組件呢？ 😰

🐶1_bit：組件我們可以當做是一種元素或是一種工具，就像我們在 Photoshop 中可以用很多工具畫出圓框、方框等；在 IVX 中，組件就是網頁元素例如按鈕、文本框、圖片框，又或是一些功能等，我們可以把這些東西畫在編輯器中的白色頁面之上，這樣我們就可以通過 “畫畫” 的方式將這些元素給放置到畫布上了。注意，只有絕對定位布局可以自己繪制內容。

👸小媛：哇，明白了，好厲害呀，可以直接畫出一個頁面，但是絕對定位布局到底是什么呢？

🐶1_bit：先別急，我們通過實例繼續講解吧，然后再知道這個絕對定位布局是什么吧。

👸小媛：行的。

🐶1_bit：接下來我們進行繪制內容吧。你看下圖，我們將鼠標長時間停留在組件外觀為 T 的組件上，將會發現這時會出現這個組件的詳細信息，在這里我們只需要先知道這個組件為文本即可。

👸小媛：那下一步要做什么呢？

🐶1_bit：接下來我們只需要點擊 T 組件，這時鼠標將會變成一個十字樣，然后在白色頁面中按住鼠標左鍵進行拖拽就會出現下圖示例。

👸小媛：接下來就放開鼠標左鍵就可以了嗎？

🐶1_bit：是的，接下來我們放開鼠標組件就繪制出來了一個文本框，這個文本框也是對應著我們網頁中的文本框元素。你可以看下圖，我們發現此時前臺下有一個文本1（藍色框框選），這個文本1則是屬于這個前臺頁面下的元素，我們點擊這個元素將會在白色頁面中顯示這個文本框的大小，這個文本框大小與我們所繪制的文本框大小一致，而左側紅色框框選部分則為這個文本框的屬性內容，我們可以更改屬性內容更改這個文本框的顏色、背景色等。

👸小媛：哇，好厲害啊，那前臺到底是啥。

🐶1_bit：在一個網站中，前臺就是指我們用來呈現的頁面；例如你平常瀏覽的網頁都是指前臺，但是前臺所顯示的數據，例如 CSDN 的頁面，數據都是從后臺做完處理返回給前臺進行顯示的；其實你可以理解前臺就是整個頁面如何排版、如何美觀的展示數據。

👸小媛：我懂了，就像出黑板報，一部分人負責整體布局設計，另外一部分人負責填充內容，前臺就是負責布局設計這一塊吧？

🐶1_bit：是的，如果這個時候我們覺得這個大小繪制不對，我們可以通過拉伸這個文本元素的 8 個小點對這個文本元素進行大小調整。

👸小媛：那如果是我的位置繪制錯誤了呢？

🐶1_bit：那也很簡單，你直接鼠標左鍵單擊這個文本框按住不放，移動鼠標就可以移動這個文本框元素的位置了。

👸小媛：哈哈哈，明白了。

🐶1_bit：那我現在先告訴你什么是絕對定位。

👸小媛：好勒。 😋

🐶1_bit：其實絕對定位就是指當期元素所在位置固定。例如我們這個白色的頁面，擁有一個 x 和 y 坐標，而你所繪制的元素如果初始點所在位置是 (200,200)，那么這個元素就永遠左上角在 (200,200) 這個位置進行繪制，下圖紅色框所框選的就是這個文本元素的起始點，而這個起始點所在的位置就是 (95,69)。

👸小媛：明白了，但是這個 x 和 y 坐標是怎么算的呢？

🐶1_bit：其實你這個時候應該可以看到，下圖黃色框選位置的值，例如橫軸為 x，x軸將會有坐標數值，豎軸為 y，y軸也是有刻度數值，此時就可以確定這個坐標系的 x 和 y 軸了。

👸小媛：明白了。我設置了這個文本框的 x 和 y 的值為 0 和 0 后這個文本框出現在了左上角耶，并且我更改了內容，就顯示了呢。

🐶1_bit：是的，更改屬性內容就會顯示別的值，在這里還是要提一點，屬性中的寬度和高度都是以像素為單位呢。

👸小媛：明白了。

🐶1_bit：我們這個文本框其實可以如果超出了白色屏幕你覺得會怎樣？

👸小媛：不懂，應該是只會顯示白色屏幕內的內容吧？

🐶1_bit：真聰明，是的，你看下面，我更改了這個文本框的背景色。

🐶1_bit：之后接下來我拖拽這個文本框超出這個白色頁面。

🐶1_bit：再點擊預覽，此時就會彈出一個界面，這個界面就可以預覽了。

👸小媛：你不是說不會顯示完內容的嗎？為什么現在還會顯示？

🐶1_bit：因為我們這個是瀏覽器自動切換成了一個電腦瀏覽的界面，你還記得我們的屏幕在編輯器中是一個豎著的形狀嗎？看下圖，那個可是一個 iPhone6 手機的屏幕。

👸小媛：你意思是說屏幕不對？那如何切換成手機屏幕呢？

🐶1_bit：我們瀏覽器按 F12，然后在出現的源碼窗中點擊下圖紅色部分框選的手機圖標應用就會切換成一個手機屏幕，當然，還需要選擇下圖紫色框框選的機型，這個時候就可以出現一個跟編輯器中完全一致的屏幕內容了。由此可見此時文本框元素將會只顯示其中一部分。

👸小媛：哇，真神奇，我第一次知道瀏覽器可以這樣用。 😅

🐶1_bit：其實這個是剪切功能，如果你想顯示被剪切的內容可以向我下圖一樣設置。

🐶1_bit：這個時候預覽就會出現滾動條，通過滾動條可以顯示這個文本框的內容。

👸小媛：你這個剪切設置在哪呀？

🐶1_bit：其實你可以點擊前臺就可以看見了。

👸小媛：哈哈哈，明白了。

開始制作 Web 端簡歷

🐶1_bit：那我們現在就正式制作 WEB 端簡歷吧。

👸小媛：迫不及待了 bit 哥。

🐶1_bit：我們從頭開始吧，新建一個 絕對定位 的 WebAPP、小程序應用，并且可以創建一個名稱。

👸小媛：嗯，做好了這一步。

🐶1_bit：接下來我們可以選擇一個合適的頁面。

👸小媛：為什么要選擇電腦類型的呢？

🐶1_bit：那是因為我們做的是電腦端的 WEB 頁喲~

👸小媛：明白了，已經按照步驟做好。

🐶1_bit：接下來，我們點擊前臺，在組件按鈕中點擊新建一個頁面，這個頁面你也可以進行重命名，我在這里重命名為了簡歷頁。

👸小媛：明白。

🐶1_bit：我們繼續往下，在最開始的效果圖中我們可以知道，這個簡歷左側是有一列內容，此時我們可以新建一個列。

👸小媛：什么是列？

🐶1_bit：就是指內容是從上往下進行排列，例如橫叫做一行，豎著叫做一列；我們左側內容其實是豎著排列，每一行就只有一個元素內容，所以就是需要創建一個列，在列中創建這些元素進行顯示就好了，你看看原圖，左側藍色部分內容元素都是豎著的。

👸小媛：是喲，每一個元素都是豎著進行排列，知道了，那我該怎么做呢？

🐶1_bit：這個時候我們可以找到現在編輯器環境，在編輯器環境中點擊如下按鈕。

🐶1_bit：接著在屏幕上繪制就可以了。

👸小媛：可是我這里顯示這個背景色不對，我該怎么做呢？

🐶1_bit：這個時候我們選擇這個列1，將背景色改為 #254665 就可以了。

👸小媛：完成了，下一步怎么做呢？

🐶1_bit：接下來我們將新建的這個列靠左放置，可以修改這個列的 x 和 y 坐標。

👸小媛：你之前說了，修改 x 和 y 的值就可以更改位置了，然后這個 x 和 y 的值是在屬性面板中吧？

🐶1_bit：是的，此時我們點擊這個列元素，然后將會出現一個屬性面板，在屬性面板中將 x 和 y 的值改為 0 和 0 就可以了。

👸小媛：修改好了，這個列放置在左側部分了。

🐶1_bit：我們接下來繼續修改一下這個列的寬高，按照合適的寬高設置我們將會使整個頁面看起來直觀和舒服。

👸小媛：原來 bit 哥還會設計呀？

🐶1_bit：沒有沒有，我是在網上仿一個簡歷而已，哈哈哈。

👸小媛：哈哈哈，還是很厲害了。

🐶1_bit：我們繼續吧，我們現在選擇列1，在其屬性面板中修改寬值為 250，高值為 1908。

👸小媛：收到，已經修改了。

頭像制作

🐶1_bit：那我們繼續往下做。我們發現該列的第一個元素是一個頭像，在這里需要添加一個圖片元素。

👸小媛：圖片元素是不是這個？因為我感覺這個好像都是用來代表圖片。

🐶1_bit：是的。此時我們點擊列1，然后在點擊圖片，將會出現選擇頭像圖片，我們選擇圖片后，該圖片就添加至了列1之中，并顯示。

👸小媛：可是我自己的圖片好大只啊。 😒

🐶1_bit：沒關系，此時只需要點擊圖片，在起出現的屬性面板中調整寬度就可以了。

👸小媛：明白了，我解決了，輸入值大小就可以調整圖片大小。

🐶1_bit：嗯，此時我們將圖片設置一個跟我一樣的雨滴狀的圓角。

👸小媛：雨滴狀感覺超級好看。 😥

🐶1_bit：畢竟是需要點個性嘛~ 其實此時我們點擊圖片，在其屬性面板中我們可以找到這個屬性。

👸小媛：這個有什么功能呢？

🐶1_bit：我們可以看圓角位置，如果全部為橘色則表示這個圖片的四個角都將受到邊框圓角值的影響。例如此時我將邊框圓角的值設為 50，你看看現在的圖片會怎樣。

👸小媛：圖片的四個角變圓潤了耶。

🐶1_bit：對的，邊框圓角值越大，角度越圓潤，到達180 時將會變成一個圓形圖片。

👸小媛：那水滴形狀的頭像怎么實現呢？

🐶1_bit：其實很簡單，我們只需要在圓角位置將圖片需要變成圓角位置的角落取消即可。

👸小媛：真棒，完成了。

🐶1_bit：接著我們應該要為這個頭像設置間隔頂部的距離。很簡單，我們找到 列1，在屬性面板中將 上內邊距 設置為 15，此時就可以讓圖片進行與頂部實現間隔了。

👸小媛：上內邊距是什么意思呀？

🐶1_bit：其實我們可以理解在這個行中有一個透明的墻，這個墻呢你可以設置墻的大小，有這個列上面的墻、左邊的墻、右邊的墻、下面的墻；我們可以設置這些墻的厚度，也可以設置這些墻是向外還是向內；在這里我設置的是這個列表中上面的一堵墻，往內再加厚一點，數值為 15，這樣就可以撐開這個圖片與頂部的距離了。

👸小媛：那想左邊也間隔一定距離那意思就是再設置個左內邊距咯？

🐶1_bit：是這個意思。

👸小媛：哈哈哈，我設置好了。

個人信息內容編寫

🐶1_bit：真聰明。我們繼續，現在我們看一下在頭像之下的元素都是一個圖片加一行介紹；那這個時候一行有兩個元素了，是使用列還是使用行呢？

👸小媛：是行嘛？

🐶1_bit：是的，其實我們在這個列表里面添加一個行，然后在這個行中添加一個圖片和一個文本就可以了，首先我們點擊列1，再從出現的組件中選擇行即可。

👸小媛：可是這樣創建的行背景色不一樣耶？還有跟頂部黏在一起太難看了。 😂

🐶1_bit：我們先解決跟頂部黏在一起的問題，之后在解決背景色的問題。

👸小媛：我已經解決了跟頂部黏在一起的問題了，只需要將行的外邊距設置一個值就可以了；應該剛剛你說內邊距就等于有一個隱形的墻往內加厚度，我現在使用外邊距就可以往外加厚度了，這樣就間隔了。

🐶1_bit：沒錯，是這個意思。那么我們現在往這個行里面添加一張圖片吧；點擊圖片組件即可添加一張照片。想要素材的私聊我 bit 就可以了，我發給你們。

👸小媛：可是添加出來的圖片又很大了。

🐶1_bit：那這個時候就應該跟之前一樣，再次在圖片的屬性面板中修改一下圖片的寬高大小了，修改完大小再點擊這個行，在這個行之中添加一個文本框，在里面輸入 1_bit。

👸小媛：感覺好丑啊。

🐶1_bit：沒事，馬上就好看了。我們點擊這個行，在屬性面板中設置該行的高為 40。

👸小媛：看起來好了很多。

🐶1_bit：還沒完呢，我們繼續點擊行的背景顏色，將背景顏色中的 Alpha 設置為0；Alpha 為一個透明度設置，設置為 0 則表示完全透明。

👸小媛：明白了，效果是這樣。

🐶1_bit：接下來我們修改一下這一行文本的字號大小，點擊文本，在屬性面板中設置字號大小為 18，字體樣式為一個正的大 T，這個大 T 表示加粗，然后再選擇文字顏色為白色就可以完成字體的設置了。

👸小媛：可是還是沒跟左邊間隔，感覺怪怪的。

🐶1_bit：其實很簡單，只需要設置這個文件的左外邊距就可以了；你不是會的嘛？

👸小媛：哈哈哈，突然忘記了，不過我現在設置好了。

🐶1_bit：那么，現在左側的個人信息剩下的就很簡單了，直接賦值黏貼這一行，在列中進行增加就可以了。

👸小媛：不過這個時候出現了幾個同樣名稱的東西，并且內容也一致。

🐶1_bit：那是因為你復制了元素，這個元素的內容、設置都將會一并的在黏貼對象中生效。

👸小媛：唔，原來如此。

🐶1_bit：接下來很簡單，我們直接更改一下名字，改完名字后再進去每一行的文本框中修改內容即可，然后圖片信息只需要雙擊圖片對象前面的小圖標，就會彈出一個圖片選擇框，選擇對應的圖片后將會顯示到個人信息預覽中。

🐶1_bit：修改完畢后內容如下。

👸小媛：那為什么最后一行換行了？

🐶1_bit：那是因為換行了，我們可以在這一行的屬性面板中把自動換行給取消掉。

👸小媛：可是超出格子了怎么辦？

🐶1_bit：那就調小一點字體吧，調成 13 就可以了。

👸小媛：啊哈哈，成功了。 😎

🐶1_bit：其實你發現一個現象沒？在對象樹面板中，越靠近底下的元素在頁面上越靠前？

👸小媛：哈哈哈，發現了。我還發現可以拖動上面的內容調整位置。

🐶1_bit：是的，這個點要注意。現在我們接著在這個列中創建一個文本框，這個文本框的內容直接賦值下面內容粘貼過去就可以完成了。

語言能力：大學英語6級證書，榮獲全國大學生英語競賽一等獎，能夠熟練的進行交流、讀寫。計算機：計算機二級證書，熟練操作windows平臺上的各類應用軟件，如Word、Excel。團隊能力：具有豐富的團隊組建與擴充經驗和項目管理與協調經驗，能夠獨擋一面。

🐶1_bit：然后記住設置文字字號、顏色、加粗和上邊距，由于設置方式跟之前一樣我就不再贅述了。

👸小媛：哈哈哈，我覺得你在偷懶。 😂

🐶1_bit：其實這是第一節內容，熟悉軟件、操作是最重要的，在這里能實現就這樣實現就可以了的。

👸小媛：你說的都對。 😂

🐶1_bit：問題不大，我們繼續往下完成如下效果。

👸小媛：其實也就是添加一個文本之類的吧。

🐶1_bit：是的，繼續在這個列里面添加一個文本，輸入計算機，然后在添加一根分割線就可以完成這個操作了，分割線如下圖進行添加。

👸小媛：就這么簡單嘛。

🐶1_bit：是的，這個時候我們為文本框增加上邊距、設置顏色之類的操作就可以了。在這里主要是設置分割線的長度和寬度；我們點擊分割線，將會在屬性面板中看到如下信息。

👸小媛：你意思就是說設置線條長度和寬度就可以了吧？真簡單，我完成了。

🐶1_bit：哈哈哈，下面另外一個英語就直接復制就可以了，然后改一下文本內容和長度就可以完成了。

右側詳細信息內容編寫

👸小媛：現在就開始做另外一半了吧？

🐶1_bit：對的，簡單吧？

👸小媛：很簡單，我感覺我現在都會做了。

🐶1_bit：那你說說怎么做？

👸小媛：右邊繼續添加一個列唄，設置左的內邊距一定單位就可以同時與左邊這一列進行間隔了。

🐶1_bit：是這么回事，我告訴你數據，你現在創建一個列，寬 750 高 1908 ，左內邊距為 30，頂部內邊距為 30 就可以了，由于左列的起始坐標位置 x 為 0 ，y 為 0 ，寬為 250，那么此時這個列就應該所在位置 x 值為 250，y 值為 0，設置好背景色透明度就可以完成了。

👸小媛：明白。

👸小媛：我還創建了一個文本框呢。

🐶1_bit：厲害了，那你覺得接下來怎么做？

👸小媛：很簡單，我改一下這個文本框字號大小，和文字顏色為 #254665 就可以了。

🐶1_bit：哈哈哈，可以的。那接下來怎么做呢？

👸小媛：接下來添加一個文本，距離上部外邊距為 30，并且設置顏色值為 #254665 以及調整一下合適的字號大小就好了。

🐶1_bit：那下面的學歷背景怎么做？

👸小媛：加一個行，然后這個行中第一個元素是圖片，第二個元素是一個列，這個列有兩個值，一個是文本，一個是分割線，這樣就完成了。

🐶1_bit：那你去試著寫一下？

👸小媛：沒問題，首先我創建一個行，往里面添加一個圖片。

🐶1_bit：然后呢？

👸小媛：然后調整一下這個圖片的大小，我這里選 60。

🐶1_bit：那你怎么增加這個圖片背景的顏色呢？

👸小媛：我看屬性有一個圖片背景色，我想增加上去。

👸小媛：果然如此，然后更改圓角值就可以了。

🐶1_bit：厲害，那現在在列了。

👸小媛：在這一行的列里增加一個文本，內容為學歷背景。這里都是之前用了很多次了，我就直接截圖給你看了。

🐶1_bit：行，你把背景透明設置為 0 吧，我覺得應該沒啥問題了，在調整一點外邊距就可以了。

👸小媛：嗯，我需要給整個行設置一個上外邊距為 30，然后給這個行 里面的列設置一個左的外邊距為 30，這樣整個行可以與上部間隔，然后這個行內部的列也可以與左邊的圖片進行間隔。

🐶1_bit：其實你現在已經做出了下面幾個標題了喲。

👸小媛：是的，下面幾個標題都是一樣的形式，只有圖標和文本不同，我再復制這個行，然后修改一下文本內容和圖片就可以了，然后我還為了方便區分設置了名稱。

🐶1_bit：不錯，越來越規范了。

👸小媛：然后我進入其它兩個行里面設置圖片和文本就可以了。

🐶1_bit：你繼續往里面添加內容吧。

👸小媛：我覺得我偷懶就可以了，因為我已經學會了，接下來我就用 3 個文本框添加內容吧。

🐶1_bit：行，因為技巧目前來說都是一樣的。

👸小媛：我直接賦值添加 1 個文本框，里面輸入以下內容。

2011.09 - 2015.07  CSDN大學  本科 IVX 方向
GPA 3.66/4 （專業前5%）
主修課程：
Spring + Hibernate + Struts2+shiro+Activiti+JQuery easyUI+IVX

👸小媛：我添加了一個文本框，然后將這個文本框放到了學歷背景上面，因為之前有說，越往下的在頁面上顯示越靠前，所以在對象樹中學歷背景應該在內容之下，這樣文本放之后就會正確顯示在頁面之下。

🐶1_bit：不錯，看來你記住了。

👸小媛：接下來我調整一下字體，然后就 ok 了。

👸小媛：再復制到其它地方，更改完了內容就完成了。工作簡歷內容為方便讀者測試，已列出來。

注：簡歷文案為互聯網上所得，如有違規請私信博主2016.06 - 2021.05 **電商平臺責任描述：
1、 參與項目新需求分析，各個功能模塊間的后臺開發，后臺代碼編寫，數據庫設計
2、 參與訂單模塊功能的實現以及購物車方案的制定和開發;
3、 負責后臺商品信息的管理，包括圖片上傳、預覽，商品上傳、修改，訂單管理。
4、 參與后期部分功能的二次開發以及項目的維護；
5、 其他：負責公司網上商城維護；項目描述：
本商城采用SOA架構，基于SSM框架，使用maven完成開發，系統分為前臺和后臺，為了降低系統間的調用低耦合，對表現層和服務層進行了分離，使用HttpClient進行表現層和服務層之間的訪問，在表現層和數據庫之間使用了redis技術作為緩存，解決高并發等可能造成的服務器壓力。由于業務量不斷擴大，用FastDFS替換了前期直接將圖片保存在項目服務器上的方式，減少服務器的壓力。使用了solr為搜索服務提供有力的支持，提高檢索效率。針對用戶可能會在各個不同的系統之間訪問造成多次登陸問題，使用了單點登錄的sso技術。

👸小媛：以下為個人喜好文案。

注：簡歷文案為互聯網上所得，如有違規請私信博主javaEE：熟練 IVX：精通個人評價：
1. 有良好的代碼風格，習慣優化代碼，多寫注釋
2. 參與過多個項目的開發，熟悉常見業務處理，能快速融入團隊
3. 對工作盡職盡責，樂于從事有挑戰性的工作，心里承受能力強
4. 學習能力強，接受新技術快，看看案例就能按需求寫出代碼
5. 能接受短期外派，出差和適量加班

🐶1_bit：不錯，你這個舉一反三的例子挺強的，我都覺得你是不是學過了，過來逗我玩的。

👸小媛：哈哈哈，沒有，這說明我厲害，所有的頁面編寫完后，點擊預覽。

👸小媛：將會得到以下預覽效果。 😎

🐶1_bit：不錯，第一節就熟練了，之后我們再做一些別的東西，包括如何發布這個網頁。

👸小媛：哈哈哈，多謝 bit 哥。