第七章實驗（二）：使用for循環生成網頁相冊
注意：
完成實驗一後再繼續下面操作。
將圖片資源下載到網站的根目錄(/usr/local/httpd/htdocs/)下。
1.下載並解壓縮：
yum -y install ImageMagick ##安裝圖片轉換工具，支持convert
lftp ftp.linuxfan.cn
lftp ftp.linuxfan.cn:~> cd tools/
lftp ftp.linuxfan.cn:/tools> get for_html_img.tar.xz
164757244 bytes transferred
lftp ftp.linuxfan.cn:/tools> bye
tar Jxvf for_html_img.tar.xz ##解壓
cd img/
2.編寫腳本：
[root@www img]# vim for_html.sh
#!/bin/bash
##創建相冊
echo "Creating album..."
mkdir -p thumbs
###########創建html頭部###############
cat <<EOF >index.html
<html>
<head>
<style type="text/css">
body {
;
margin:0 auto;
border:1px dashed grey;
padding:10px; background:#000;
}
img { margin:5px; border:1px solid black;}
h1 {
color:#fd6edf;
font-size:48px;
font-style:bold;
font-family:"華文行楷"; ;
height:50px;
background:#eded56;
}
</style>
</head>
<body>
<center><h1>www.linuxfan.cn</h1></center>
<embed src="ibl.mp3" autostart=true loop=true></embed>
EOF
###########爲所有圖片設置a標籤###################
for img in *.jpg;
do
convert "$img" -resize "300x" thumbs/$img ##將大圖轉爲小圖並放到thumbs/目錄下
echo "<a href=\"$img\" target=\"_blank\"><img src=\"thumbs/$img\" title=\"$img\" />" >>index.html
done
###############創建網頁的尾部###############
cat <<END >>index.html
</body>
</html>
END
echo "index.html is ok."
:wq
[root@www img]# sh -x for_html.sh
3.訪問測試：
