30秒就可以把所有員工照片導入表格中，小白也可以輕松完成任務

溫馨提示】親愛的朋友，閱讀之前請您點擊【關注】，您的支持將是我最大的動力！#如何提高自己的職場競爭力#

從事人事部門工作的小伙伴們，對于員工信息、員工檔案表非常熟悉了。

那么你創建的員工檔案表中有員工照片嗎？

員工照片你是一張張插入圖片完成的嗎？

今天阿鐘老師教你Excel中批量導入圖片，再多的員工照片導入也是分分鐘的事。

下圖表格是我們創建的員工信息表，照片需要插入到D列，并且要和姓名對應。

我們的員工照片放在了E盤【員工照片】文件夾中，文件名以員工姓名命名。

首先，我們在員工信息表D2單元格輸入公式：="<table><img src=""E:\員工照片\"&C2&".jpg""width=""177""height=""248"">"

然后再向下填充公式，效果如下圖。

公式中用的是HTML超文本語言，你只記住這幾處即可：

1、E:\員工照片\ 為存放照片的文件夾，如果你的照片不是存放在這里，可以修改成你的文件夾；

2、.jpg 為照片的格式，一般圖片的格式還有.JPEG、.BMP、.PNG等，你的照片是什么格式，在這里修改；

3、177、248 這兩個數字是照片的寬度和高度，可以鼠標右鍵點擊照片，查看照片的寬度和高度。

接下來，我們需要打開電腦上的記事本程序。

復制D列的公式內容，粘貼到記事本中，如下圖：

調整員工信息表中D列的列寬和表格的行高，以便容下照片，如果不確定尺寸的話，盡量大一些。

復制【記事本】的內容，然后回到Excel，鼠標右鍵點擊D2單元格，在彈出的菜單中選擇【選擇性粘貼】

在選擇性粘貼窗口中，方式選擇【Unicode文本】，最后點擊【確定】

大功造成，照片全部按照姓名對應到表格中了。是不是很簡單呢，趕快去操作試試吧！

小伙伴們，在使用Excel中還碰到過哪些問題，評論區留言一起討論學習，堅持原創不易，您的點贊轉發就是對小編最大的支持，更多教程點擊下方專欄學習。

TML中的表格是由<table>標簽進行定義的，表格在HTML中的表現形式與使用方法與word中的表格非常類似。多數情況使用Dreamweaver的可視化視圖只做表格更為簡單、方便。本文主要講述如何使用代碼來編寫表格，讓大家掌握表格的代碼書寫格式與其對應的屬性。

表格的標簽組成

HTML中的表格是由<table>為主體標簽，瀏覽器會將該標簽解釋為一個表格。表格中的行使用<tr>標簽進行定義。<tr>標簽為<table>標簽的子類，設置若干個<tr>標簽可以將表格分割為若干個行。<td>標簽用于定義表格的列，<td>標簽為又是<tr>標簽的子類，因此每個行都需要設置相應數量的<td>標簽來分割列，形成一個完整的表格。

表格的標簽組合關系為：

<table>

<tr>

<td>我是單元格1</td>

<td>我是單元格2</td>

</tr>

</table>

表格中可以插入文本、圖片、列表、段落、表單、水平線等任何html標簽，甚至可以用來做頁面布局。但是table布局存在代碼冗余過長、不符合HTML規范、搜索引擎不友好等問題。因此建議大家盡量不要使用table進行頁面布局，除非頁面中確實需要一張表格。

剩下的<th>、<thead>、<tbody> 和 <tfoot>很少被用到，這是由于瀏覽器對它們的支持不太好。

表格和邊框屬性

表格自身可以定義border屬性來決定表格邊框的寬度，該屬性的值默認是以數字單位進行顯示，例如border=”1″該值的單位為px。注意，不要在border的數值后面加上任何單位，否該值無法正確識別。

表格的表頭

在<table>中可以通過<th>標簽設置表頭，表頭的<th>標簽與<tr>標簽屬于平級，并且表頭一般出現在<tr>標簽的前面。對于一個表格來說，表頭并不是必須的，可以根據需要插入表頭。<th>標簽內的文字會被自動加粗。

單元格的合并

單元格的合并分為垂直合并與水平合并，在合并時需要確定其他行與列中是否有對應數量的單元格。

水平合并單元格使用colspan屬性，其值是用數字的形式確定需要合并的單元格數量，例如colspan=”2″即代表向右合并兩個單元格。

垂直合并單元格使用rowspan屬性，與水平合并的屬性相同，同樣也是以數字形式確定需要合并的單元格數量，例如rowspan=”2″代表向下合并兩個單元格。

實例演示代碼：

<tr>

</tr>

<tr>

<td>Bill Gates</td>

</tr>

</table><h4>橫跨兩行的單元格：</h4>

<tr>

<td>Bill Gates</td>

</tr>

<tr>

</tr>

<tr>

</tr>

</table>

單元格邊距

表格具有與padding樣式類似的內邊距功能。通過在<table>標簽內定義cellpadding屬性，來為其標簽下的所有<td>元素設置內邊距。cellpadding屬性的參數是值是以數字的形式來確定邊距的大小，例如cellpadding=”10″ 則表示table中的所有<tr>標簽內邊距為10px

單元格間距

單元格的間距是設置<tr>標簽的外邊距，這個也與css樣式中的margin類似，通過在<table>標簽內定義cellspacing屬性，來為其標簽下的所有td元素設置外邊距。該屬性也是以數字的形式來確定外邊距的大小，例如cellspacing=”10″則表示這個table中的所有<tr>標簽的外邊距為10px

為表格設置背景

表格可以通過background屬性為表格或單元格設置任意圖片作為背景，其使用方法非常像css中的background。為background設置對應的圖片路徑，即可使單元格顯示相應的圖片。例如background=”table_bg.gif”

表格內容的對齊排列

表格的對齊分為水平對齊和垂直對齊。它們分別是align屬性與valign屬性，將這兩個屬性插入到對應的<td>標簽中即可完成單元格內文本或圖像的對齊。

水平對齊align分別有三個值：left左對齊、center水平居中、right右對齊

垂直對齊valign也有三個值：top頂端對齊、middle垂直居中、bottom底部對齊、baseline為基線對齊。

其中基線對齊可能無法從字面上理解，其實基線對齊也就是文本出現在表格的中上部而不是正中央。如果文字不大的話，效果和middle差不多，比middle稍微靠上一點。

私信發送【前端】有驚喜！

挑戰30天在頭條寫日記#

HTML是一種用于創建網頁結構和內容的標記語言，其中包含了許多標簽，可以用于排版、布局和展示內容。本文將詳細介紹HTML中的<tr>和<td>標簽的使用方法，并通過示例展示如何創建表格。

1. <tr>標簽的作用： <tr>標簽代表HTML表格中的一行（行數據），它可以包含一個或多個<td>元素作為單元格。

2. <td>標簽的作用： <td>標簽用于定義表格中的一個單元格（列數據），可以包含文本、圖像、鏈接等內容。

3. 如何使用<tr>和<td>： 在使用<tr>和<td>標簽時，首先需要創建一個<table>元素作為表格的容器，然后在其中嵌套<tr>和<td>標簽，如下所示：

htmlCopy code<table>
  <tr>
    <td>單元格1</td>
    <td>單元格2</td>
  </tr>
  <tr>
    <td>單元格3</td>
    <td>單元格4</td>
  </tr>
</table>

4. 表格樣式： 可以使用CSS來為表格添加樣式，如設置邊框、背景顏色等。以下是一個簡單的示例：

htmlCopy code<style>
  table {
    border-collapse: collapse;
    width: 100%;
  }
  td {
    border: 1px solid black;
    padding: 8px;
    text-align: center;
  }
</style>

5. 示例應用： 以下示例演示了如何使用<tr>和<td>標簽創建一個包含姓名、年齡和城市的簡單表格：

htmlCopy code<!DOCTYPE html>
<html>
<head>
  <style>
    table {
      border-collapse: collapse;
      width: 100%;
    }
    td {
      border: 1px solid black;
      padding: 8px;
      text-align: center;
    }
  </style>
</head>
<body>

<table>
  <tr>
    <td>姓名</td>
    <td>年齡</td>
    <td>城市</td>
  </tr>
  <tr>
    <td>張三</td>
    <td>25</td>
    <td>北京</td>
  </tr>
  <tr>
    <td>李四</td>
    <td>30</td>
    <td>上海</td>
  </tr>
  <tr>
    <td>王五</td>
    <td>28</td>
    <td>廣州</td>
  </tr>
</table>

</body>
</html>

6. 書籍參考：

"HTML and CSS: Design and Build Websites" by Jon Duckett
"Learning Web Design: A Beginner's Guide to HTML, CSS, JavaScript, and Web Graphics" by Jennifer Niederst Robbins

7. 總結： 通過本文的介紹，我們了解了HTML中<tr>和<td>標簽的基本用法，以及如何創建簡單的表格和添加樣式。使用這些標簽，我們可以輕松地創建具有結構和內容的網頁表格，提升頁面的可讀性和可視性。

在線咨詢

上一篇：如何將doc文檔生成html頁面
下一篇：CSS bottom 屬性

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商

30秒就可以把所有員工照片導入表格中，小白也可以輕松完成任務

您的項目需求