HTML table製做我的簡歷

如何製做我的簡歷？

說到簡歷，你們應該第一個想到的是ps，或者使用word表格來製做打印

但是不少時候帶着的時候並不方便，因此今天咱們教你們用html的table標籤來製做我的簡歷

須要的時候不管哪一個手機均可以查看本身的簡歷！

是否是很方便呢？

----------------------------------------------------------------

ok！廢話很少說，直接上教程：

table是html中的一個表格標籤

這個標籤實用性很高，但出場率並不高

他能夠用來作網頁佈局，亦能夠拿來作表格

通俗一點說table就是一個盒子

他是這樣的

----------------------------------------------------------------

它下面你能夠給他橫排和縱排

分別是tr和td

看上去就是一個表格啦

(tr表示橫排td表示豎排，因此td裝在tr內)

他是這樣的

----------------------------------------------------------------

固然，這時候table是沒有邊框的

咱們再給它加上邊框一個基本的我的簡歷就製做完成了

好的

下面開始咱們的代碼教程

----------------------------------------------------------------

首先

咱們放上一張圖片img

而且給他設置我想要的寬高，這裏用的是300像素

----------------------------------------------------------------

接下來添加table表格

先來一個tr，六個td

分別寫上姓名 民族 聯繫號碼

順便用div分別裝上img和table

設置div寬爲100%；高就自適應

這樣的目的是分開圖片和表單並居中

----------------------------------------------------------------

接下來給table邊框寫上去

還有寬高

----------------------------------------------------------------

下面的內容本身添加

可點擊使用的是a標籤

將a標籤嵌套在td內便可

咱們來說講精華部分

若是是空白部分想要佔幾行怎麼辦？

給他添加colspan屬性便可

值爲幾即是幾行

這裏咱們使用的是5行

添加上便可

----------------------------------------------------------------

那同時佔兩列呢？

很簡單，用rowspan屬性便可

同理值爲幾跨幾列

不過值得注意的是

第一個tr內的td設置了之後它佔兩列，可是下面的tr首個成爲了第二個，由於第一個的位置被上一個tr內的td佔了

最後最後

td內的居中用td屬性的align，值爲center，也就是居中的意思

----------------------------------------------------------------

新手領地

html爲結構

css爲樣式

javascript是行爲，簡稱js

html內的標籤自帶屬性用等號（=）

如：<td rowspan="2" align="center">1</td>

這裏的rowspan align都是屬性，2和center是值

css中的叫樣式

通常用類名（class=「」）取名使用或id命名

css都是用的「：」而不是「=」

如：

width: 100%;

display: flex;

justify-content: center;

align-items: center;

（以上內容均爲自創，轉載註明出處，不然必將追究其責任）

轉自：公衆號 雙魚站

做者：小魚兒