整合營銷服務商

          電腦端+手機端+微信端=數據同步管理

          免費咨詢熱線:

          HTML常用代碼集合,背完這些基本可以自己做表白網頁了

          lt;marquee>...</marquee>普通卷動

          <marquee behavior=slide>...</marquee>滑動

          <marquee behavior=scroll>...</marquee>預設卷動

          <marquee behavior=alternate>...</marquee>來回卷動

          <marquee direction=down>...</marquee>向下卷動

          <marquee direction=up>...</marquee>向上卷動

          <marquee direction=right></marquee>向右卷動

          <marquee direction=left></marquee>向左卷動

          <marquee loop=2>...</marquee>卷動次數

          <marquee width=180>...</marquee>設定寬度

          <marquee height=30>...</marquee>設定高度

          <marquee bgcolor=FF0000>...</marquee>設定背景顏色

          <marquee scrollamount=30>...</marquee>設定卷動距離

          <marquee scrolldelay=300>...</marquee>設定卷動時間

          <!>字體效果

          <h1>...</h1>標題字(最大)

          <h6>...</h6>標題字(最小)

          <b>...</b>粗體字

          <strong>...</strong>粗體字(強調)

          <i>...</i>斜體字

          <em>...</em>斜體字(強調)

          <dfn>...</dfn>斜體字(表示定義)

          <u>...</u>底線

          <ins>...</ins>底線(表示插入文字)

          <strike>...</strike>橫線

          <s>...</s>刪除線

          <del>...</del>刪除線(表示刪除)

          <kbd>...</kbd>鍵盤文字

          <tt>...</tt> 打字體

          <xmp>...</xmp>固定寬度字體(在文件中空白、換行、定位功能有效)

          <plaintext>...</plaintext>固定寬度字體(不執(zhí)行標記符號)

          <listing>...</listing> 固定寬度小字體

          <font color=00ff00>...</font>字體顏色

          <font size=1>...</font>最小字體

          <font style =font-size:100 px>...</font>無限增大

          <!>區(qū)斷標記

          <hr>水平線

          <hr size=9>水平線(設定大小)

          <hr width=80%>水平線(設定寬度)

          <hr color=ff0000>水平線(設定顏色)

          <br>(換行)

          <nobr>...</nobr>水域(不換行)

          <p>...</p>水域(段落)

          <center>...</center>置中

          <!>連結格式

          <base href=位址>(預設好連結路徑)

          <a href=位址></a>外部連結

          <a href=位址 target=_blank></a>外部連結(另開新視窗)

          <a href=位址 target=_top></a>外部連結(全視窗連結)

          <a href=位址 target=頁框名></a>外部連結(在指定頁框連結)

          <!>貼圖/音樂

          <img src=圖片位址>貼圖

          <img src=圖片位址 width=180>設定圖片寬度

          <img src=圖片位址 height=30>設定圖片高度

          <img src=圖片位址 alt=提示文字>設定圖片提示文字

          <img src=圖片位址 border=1>設定圖片邊框

          <bgsound src=MID音樂檔位址>背景音樂設定

          <!>表格語法

          <table aling=left>...</table>表格位置,置左

          <table aling=center>...</table>表格位置,置中

          <table background=圖片路徑>...</table>背景圖片的URL=就是路徑網址

          <table border=邊框大小>...</table>設定表格邊框大小(使用數字)

          <table bgcolor=顏色碼>...</table>設定表格的背景顏色

          <table borderclor=顏色碼>...</table>設定表格邊框的顏色

          <table borderclor=顏色碼>...</table>設定表格邊框的顏色

          <table borderclordark=顏色碼>...</table>設定表格暗邊框的顏色

          <table borderclorlight=顏色碼>...</table>設定表格亮邊框的顏色

          <table cellpadding=參數>...</table>指定內容與格線之間的間距(使用數字)

          <table cellspacing=參數>...</table>指定格線與格線之間的距離(使用數字)

          <table cols=參數>...</table>指定表格的欄數

          <table frame=參數>...</table>設定表格外框線的顯示方式

          <table width=寬度>...</table>指定表格的寬度大小(使用數字)

          <table height=高度>...</table>指定表格的高度大小(使用數字)

          <td colspan=參數>...</td>指定儲存格合并欄的欄數(使用數字)

          <td rowspan=參數>...</td>指定儲存格合并列的列數(使用數字)

          <!>分割視窗

          <frameset cols="20%,*">左右分割,將左邊框架分割大小為20%右邊框架的大小瀏覽器會自動調整

          <frameset rows="20%,*">上下分割,將上面框架分割大小為20%下面框架的大小瀏覽器會自動調整

          <frameset cols="20%,*">分割左右兩個框架

          <frameset cols="20%,*,20%">分割左中右三個框架

          <分割上下兩個框架

          <frameset rows="20%,*,20%">分割上中下三個框架


          <! - - ... - -> 注解

          <a href target> 指定超連結的分割視窗

          <a href=#錨的名稱> 指定錨名稱的超連結

          <a href> 指定超連結

          <a name=錨的名稱> 被連結點的名稱

          <address>....</address> 用來顯示電子郵箱地址

          <b> 粗體字

          <base target> 指定超連結的分割視窗

          <basefont size> 更改預設字形大小

          <bgsound src> 加入背景音樂

          <big> 顯示大字體

          <blink> 閃爍的文字

          <body text link vlink> 設定文字顏色

          <body> 顯示本文

          <br> 換行

          <caption align> 設定表格標題位置

          <caption>...</caption> 為表格加上標題

          <center> 向中對齊

          <cite>...<cite> 用於引經據典的文字

          <code>...</code> 用於列出一段程式碼

          <comment>...</comment> 加上注解

          <dd> 設定定義列表的項目解說

          <dfn>...</dfn> 顯示"定義"文字

          <dir>...</dir> 列表文字標簽

          <dl>...</dl> 設定定義列表的標簽

          <dt> 設定定義列表的項目

          <em> 強調之用

          <font face> 任意指定所用的字形

          <font face> 任意指定所用的字形

          <font size> 設定字體大小

          <form action> 設定戶動式表單的處理方式

          <form method> 設定戶動式表單之資料傳送方式

          <frame marginheight> 設定視窗的上下邊界

          <frame marginwidth> 設定視窗的左右邊界

          <frame name> 為分割視窗命名

          <frame noresize> 鎖住分割視窗的大小

          <frame scrolling> 設定分割視窗的卷軸

          <frame src> 將html檔加入視窗

          <frameset cols> 將視窗分割成左右的子視窗

          <frameset rows> 將視窗分割成上下的子視窗

          <frameset>...</frameset> 劃分分割視窗

          <h1>~<h6> 設定文字大小

          <head> 標示文件資訊

          <hr> 加上分格線

          <html> 文件的開始與結束

          <i> 斜體字

          <img align> 調整圖形影像的位置

          <img alt> 為你的圖形影像加注

          <img dynsrc loop> 加入影片

          <img height width> 插入圖片并預設圖形大小

          <img hspace> 插入圖片并預設圖形的左右邊界

          <img lowsrc> 預載圖片功能

          <img src border> 設定圖片邊界

          <img src> 插入圖片

          <img vspace> 插入圖片并預設圖形的上下邊界

          <input type name value> 在表單中加入輸入欄位

          <isindex> 定義查詢用表單

          <kbd>...</kbd> 表示使用者輸入文字

          <li type>...</li> 列表的項目 ( 可指定符號 )

          <marquee> 跑馬燈效果

          <menu>...</menu> 條列文字標簽

          <meta name="refresh" content url> 自動更新文件內容

          <multiple> 可同時選擇多項的列表欄

          <noframe> 定義不出現(xiàn)分割視窗的文字

          <ol>...</ol> 有序號的列表

          <option> 定義表單中列表欄的項目

          <p align> 設定對齊方向

          <p> 分段

          <person>...</person> 顯示人名

          <pre> 使用原有排列

          <samp>...</samp> 用於引用字

          <select>...</select> 在表單中定義列表欄

          <small> 顯示小字體

          <strike> 文字加橫線

          <strong> 用於加強語氣

          <sub> 下標字

          <sup> 上標字

          <table border=n> 調整表格的寬線高度

          <table cellpadding> 調整資料欄位之邊界

          <table cellspacing> 調整表格線的寬度

          <table height> 調整表格的高度

          <table width> 調整表格的寬度

          <table>...</table> 產生表格的標簽

          <td align> 調整表格欄位之左右對齊

          <td bgcolor> 設定表格欄位之背景顏色

          <td colspan rowspan> 表格欄位的合并

          <td nowrap> 設定表格欄位不換行

          <td valign> 調整表格欄位之上下對齊

          <td width> 調整表格欄位寬度

          <td>...</td> 定義表格的資料欄位

          <textarea name rows cols> 表單中加入多少列的文字輸入欄

          <textarea wrap> 決定文字輸入欄是自動否換行

          <th>...</th> 定義表格的標頭欄位

          <title> 文件標題

          <tr>...</tr> 定義表格美一行

          <tt> 打字機字體

          <u> 文字加底線

          <ul type>...</ul> 無序號的列表 ( 可指定符號 )

          <var>...</var> 用於顯示變數

          科技/APP/游戲,「狂丸科學」可能是你見過最好玩的 號

          明天就是傳說中的「七夕情人節(jié)」,不知道各位小(dan)伙(shen)伴(gou)們有沒有為自己心儀的對象準備禮物呢。這都8102年了,如果你還在為了送玫瑰花還是送口紅這樣的事情糾結,可就有點說不過去了。

          今天狂丸就給大家安利一個浪漫的表白網頁在線生成網站:《表白驛站》。只要進行簡單的設置,不用寫代碼也能制作出屬于你的精美七夕表白網頁。

          網站目前一共包含了13個風格不同的表白網頁,玩家可以逐個點擊進去查看效果演示,然后再進行挑選。

          選擇完成后,點擊圖片下方的「立即制作」即可進入編輯頁面。在這一界面玩家可以對最終顯示的網頁信息進行更改,比如你的名字、Ta的名字、背景音樂等等。

          而其中最重要的就是表白內容了,在8102年,想靠「我愛你」「我喜歡你」「做我女朋友吧」這種單調且毫無營養(yǎng)的語言成功撩妹顯然是不太可能。

          不如嘗試一下今年最火的「土味情話系列」,給你浪漫的表白網頁增添一些幽默和風趣。

          (土味情話三連)

          用土味情話將內容填滿后就可以點擊「提交」,出現(xiàn)如下頁面就說明你的表白網頁就制作成功了,注意一定要復制保存好自己的專屬表白鏈接,以防不小心關閉網頁后忘記。

          玩家只要把最后生成的網址發(fā)送給想要表白的對象,對方點擊以后就會進入你制作好的表白網頁,土味情話加上溫馨的網頁動畫,相信再也不會有比這更浪漫有趣的表白禮物了。

          《表白驛站》中的每一個網頁都有專屬的風格,比如這個「男孩七夕節(jié)送花表白網頁」。玩家需要填寫的信息只有對方的姓名,完成過后的效果就是一個可愛的動畫小短片。

          還有可以讓對方與網站進行交互的「阿貍表白網頁」,被表白人每按一下鍵盤上的「↓」方向鍵,網頁就會更換一張圖片,或者移動鼠標在右下角進行選擇也可以。并且每一張的圖片上都有可編輯的句子,按一下鍵盤上的「ESC」鍵還會有驚喜出現(xiàn)。

          不過這個版本的制作過程也比較復雜,玩家需要修改每一張圖片上的文字,直接在文字上單擊鼠標進行編輯就可以。全部完成后點擊「保存修改」,就可以發(fā)送給別人了。

          除了上面幾種,玩家還可以選擇粒子文字特效、簡單打字機、多頁文字特效等其他的在線表白網頁,總有一類適合你。

          當然了,如果十三種都用過了,還是沒有人接受你的話,那就真的不是網站沒有作用。要么就是你在網頁中沒有合理的運用「土味情況」,要么就是,你......真的......不適合......過七夕......

          ↓猛戳左下角「了解更多」,更多精彩就在下方

          S和css實現(xiàn),這是部分代碼

          注:這是一個3D場景,在PC端的話還可以按住鼠標左鍵并拖動鼠標,來從各個視角觀察它。

          降低作品檔次的效果圖:





          寓意解釋:

          通過JS和CSS3組合實現(xiàn)的 碎片飄零效果。每個碎片都由一句情話組成,無數的情話碎片構成了心型。在【情歌】伴隨下,當所有【情話】碎片飛開后,便出現(xiàn)了更高的感情表達——【情畫】。

          當兩個人的情感不再需要用言語——情話來表達時(即當所有【情話】碎片飛開后),就出現(xiàn)了更高的感情境界——情畫。)


          HTML代碼

          <!doctype html>

          <html>

          <head>

          <meta charset="utf-8">

          <title>#三行情書#</title>

          <link rel="shortcut icon" href="./logo.ico" type="image/x-icon" />

          <link type="text/css" rel="stylesheet" href='http://fonts.googleapis.com/css?family=Ubuntu:300italic,300,700' />

          <link rel="stylesheet" type="text/css" href="./css/main.css">

          <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>

          <script type="text/javascript" src="./js/main.js"></script>

          </head>

          <body>

          <audio autoplay="autopaly">

          <source src="song.mp3" type="audio/mp3" />

          </audio>

          <div class="poem">

          夢隨風醉纏綿<br>

          情如繭凝成緣<br>

          百花牽衣吐艷

          </div>

          <div class="mosaica">計科1502 白XX<a href="index.html">上一頁</a></div>

          <div class="container">

          <div id="plane1" class="plane">

          <div class="items">

          <!-- 第一行 -->

          <div class="item" style="top: 0px; left: 0px; width: 100px; height: 87.5px; animation-delay: 8.64s;background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 0px; left: 100px; width: 100px; height: 87.5px; animation-delay: 8.56s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item3" style="top: 0px; left: 200px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 0px; left: 300px; width: 100px; height: 87.5px; animation-delay: 9.74s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 0px; left: 400px; width: 100px; height: 87.5px; animation-delay: 8.28s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 0px; left: 500px; width: 100px; height: 87.5px;animation-delay: 8.88s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 0px; left: 600px; width: 100px; height: 87.5px;animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 0px; left: 700px; width: 100px; height: 87.5px; animation-delay: 9.76s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 0px; left: 800px; width: 100px; height: 87.5px; animation-delay: 8.4s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>


          <div class="item2" style="top: 0px; left: 200px; width: 100px; height: 87.5px; animation-delay: 1.64s; font-size: 25px;">風</div>

          <div class="item2" style="top: 0px; left: 600px; width: 100px; height: 87.5px; animation-delay: 2.44s; font-size: 25px;">情</div>



          <!-- 第二行 -->

          <div class="item" style="top: 87.5px; left: 0px; width: 100px; height: 87.5px; animation-delay: 8.12s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 87.5px; left: 100px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item3" style="top: 87.5px; left: 200px; width: 100px;height: 87.5px;animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 87.5px; left: 300px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 87.5px; left: 400px; width: 100px; height: 87.5px; animation-delay: 8.8s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 87.5px; left: 500px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item3" style="top: 87.5px; left: 600px; width: 100px;height: 87.5px;animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 87.5px; left: 700px; width: 100px;height: 87.5px;animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 87.5px; left: 800px; width: 100px; height: 87.5px; animation-delay: 9.48s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>


          <div class="item2" style="top: 87.5px; left: 100px; width: 100px; height: 87.5px; animation-delay: 1.24s;font-size: 25px;">隨</div>

          <div class="item2" style="top: 87.5px; left: 300px; width: 100px; height: 87.5px; animation-delay: 1.84s;font-size: 25px;">醉</div>

          <div class="item2" style="top: 87.5px; left: 500px; width: 100px; height: 87.5px; animation-delay: 2.24s;font-size: 25px;">綿</div>

          <div class="item2" style="top: 87.5px; left: 700px; width: 100px;height: 87.5px;animation-delay: 2.64s; font-size: 25px;">如</div>


          <!-- 第三行 -->

          <div class="item" style="top: 175px; left: 0px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item3" style="top: 175px; left: 100px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item3" style="top: 175px; left: 200px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 175px; left: 300px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 175px; left: 400px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 175px; left: 500px; width: 100px; height: 87.5px;animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 175px; left: 600px; width: 100px; height: 87.5px;animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 175px; left: 700px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 175px; left: 800px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"> </div>


          <div class="item2" style="top: 175px; left: 0px; width: 100px; height: 87.5px; animation-delay: 1.04s;font-size: 25px;">夢</div>

          <div class="item2" style="top: 175px; left: 400px; width: 100px; height: 87.5px; animation-delay: 2.04s;font-size: 25px;">纏 </div>

          <div class="item2" style="top: 175px; left: 800px; width: 100px; height: 87.5px; animation-delay: 2.84s;font-size: 25px;">繭 </div>


          <!-- 第四行 -->

          <div class="item" style="top: 262.5px; left: 0px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 262.5px; left: 100px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 262.5px; left: 200px; width: 100px;height: 87.5px;animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 262.5px; left: 300px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item3" style="top: 262.5px; left: 400px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 262.5px; left: 500px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 262.5px; left: 600px; width: 100px;height: 87.5px;animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 262.5px; left: 700px; width: 100px;height: 87.5px;animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 262.5px; left: 800px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"></div>


          <div class="item2" style="top: 262.5px; left: 0px; width: 100px; height: 87.5px; animation-delay: 4.64s;font-size: 25px;">艷</div>

          <div class="item2" style="top: 262.5px; left: 800px; width: 100px; height: 87.5px; animation-delay: 3.04s;font-size: 25px;"> 凝</div>

          <!-- 第五行 -->

          <div class="item" style="top: 350px; left: 0px; width: 100px; height: 87.5px; animation-delay: 8.04s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 350px; left: 100px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item3" style="top: 350px; left: 200px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 350px; left: 300px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 350px; left: 400px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 350px; left: 500px; width: 100px; height: 87.5px;animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 350px; left: 600px; width: 100px; height: 87.5px;animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 350px; left: 700px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 350px; left: 800px; width: 100px; height: 87.5px; animation-delay: 8.4s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>


          <div class="item2" style="top: 350px; left: 100px; width: 100px; height: 87.5px; animation-delay: 4.44s; font-size: 25px;">吐</div>

          <div class="item3" style="top: 350px; left: 300px; width: 100px; height: 87.5px; animation-delay: 5.64s; background:none; "> I</div>

          <div class="item3" style="top: 350px; left: 400px; width: 100px; height: 87.5px; animation-delay: 5.64s; background:none; "> L</div>

          <div class="item3" style="top: 350px; left: 500px; width: 100px; height: 87.5px; animation-delay: 5.64s; background:none; "> U</div>

          <div class="item2" style="top: 350px; left: 700px; width: 100px; height: 87.5px; animation-delay: 3.24s; font-size: 25px;">成</div>



          <!-- 第六行 -->

          <div class="item" style="top: 437.5px; left: 0px; width: 100px; height: 87.5px; animation-delay: 9.68s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 437.5px; left: 100px; width: 100px; height: 87.5px; animation-delay: 8.01s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 437.5px; left: 200px; width: 100px;height: 87.5px;animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 437.5px; left: 300px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item3" style="top: 437.5px; left: 400px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item3" style="top: 437.5px; left: 500px; width: 100px; height: 87.5px; animation-delay: 15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 437.5px; left: 600px; width: 100px;height: 87.5px;animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 437.5px; left: 700px; width: 100px;height: 87.5px;animation-delay: 8.29s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 437.5px; left: 800px; width: 100px; height: 87.5px; animation-delay: 9.2s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>


          <div class="item2" style="top: 437.5px; left: 200px; width: 100px; height: 87.5px; animation-delay: 4.24s;font-size: 25px;"> 衣</div>

          <div class="item2" style="top: 437.5px; left: 600px; width: 100px; height: 87.5px;animation-delay: 3.44s; font-size: 25px;"> 緣</div>

          <!-- 第七行 -->

          <div class="item" style="top: 525px; left: 0px; width: 100px; height: 87.5px; animation-delay: 8.98s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 525px; left: 100px; width: 100px; height: 87.5px; animation-delay: 9.15s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 525px; left: 200px; width: 100px;height: 87.5px;animation-delay: 8.78s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 525px; left: 300px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item3" style="top: 525px; left: 400px; width: 100px; height: 87.5px; animation-delay:15.96s; background: url('./img/100.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 525px; left: 500px; width: 100px; height: 87.5px; animation-delay: 14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 525px; left: 600px; width: 100px;height: 87.5px;animation-delay: 8.12s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 525px; left: 700px; width: 100px;height: 87.5px;animation-delay: 8.68s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 525px; left: 800px; width: 100px; height: 87.5px; animation-delay: 8.97s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>


          <div class="item2" style="top: 525px; left: 300px; width: 100px; height: 87.5px; animation-delay: 4.04s;font-size: 25px;"> 牽</div>

          <div class="item2" style="top: 525px; left: 500px; width: 100px; height: 87.5px;animation-delay: 3.64s; font-size: 25px;"> 百</div>

          <!-- 第八行 -->

          <div class="item" style="top: 612.5px; left: 0px; width: 100px; height: 87.5px; animation-delay: 8.89s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 612.5px; left: 100px; width: 100px; height: 87.5px; animation-delay: 8.87s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 612.5px; left: 200px; width: 100px;height: 87.5px;animation-delay: 8.99s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 612.5px; left: 300px; width: 100px; height: 87.5px; animation-delay: 8.25s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>

          <div class="item" style="top: 612.5px; left: 400px; width: 100px; height: 87.5px; animation-delay:14.96s; background: url('./img/12.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 612.5px; left: 500px; width: 100px; height: 87.5px; animation-delay: 8.97s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 612.5px; left: 600px; width: 100px;height: 87.5px;animation-delay: 8.9s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 612.5px; left: 700px; width: 100px;height: 87.5px;animation-delay: 9s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"> </div>

          <div class="item" style="top: 612.5px; left: 800px; width: 100px; height: 87.5px; animation-delay: 8.5s; background: url('./img/13.jpg') no-repeat; background-size: 100% 87.5px;"></div>


          <div class="item2" style="top: 612.5px; left: 400px; width: 100px; height: 87.5px; animation-delay: 3.84s;font-size: 25px;">花 </div>

          </div>

          </div>

          </div>

          </body>

          </html>


          css代碼

          * {

          box-sizing: border-box;

          }


          主站蜘蛛池模板: 精品一区二区在线观看| 秋霞日韩一区二区三区在线观看| 一区免费在线观看| 无码人妻精品一区二区三区不卡| 日韩毛片基地一区二区三区| 日韩在线一区高清在线| 精品一区二区三区AV天堂| 中文字幕在线无码一区二区三区| 久久国产精品一区免费下载| 亚洲欧美成人一区二区三区| 国产一区二区三区樱花动漫| 日韩精品一区二区三区不卡| 成人区精品一区二区不卡| 无码人妻精品一区二区三区久久 | 国产精品一区二区久久沈樵| 丰满人妻一区二区三区免费视频| 国产在线精品一区二区在线观看| 国产经典一区二区三区蜜芽 | 色窝窝无码一区二区三区成人网站| 国产乱码一区二区三区| 亚洲欧美一区二区三区日产| 国产精品亚洲一区二区三区在线观看| 中文字幕在线视频一区| 无码人妻一区二区三区免费| 在线精品动漫一区二区无广告 | 色一情一乱一伦一区二区三欧美 | 无码人妻AⅤ一区二区三区水密桃| 濑亚美莉在线视频一区| 亚洲中文字幕乱码一区| 无码人妻精品一区二区蜜桃 | 亚洲毛片αv无线播放一区| 一区国严二区亚洲三区| 国产品无码一区二区三区在线蜜桃 | 国产AV午夜精品一区二区入口 | 久久久久人妻一区精品色| 国产成人精品久久一区二区三区| 综合一区自拍亚洲综合图区| 国产精品免费综合一区视频| 精品福利一区二区三区| 免费一区二区三区| 亚洲国产日韩在线一区|