接着之前的[css]我要用css画幅画(四)， 这次我给小明和静静增加了对话，用了简单的动画效果。 github：https://github.com/bee0060/Css-Paint ， 完整代码在pages/sun-house-4.html和相关的css中可以找到d ...
接着之前的[css]我要用css画幅画(四)， 这次我给小明和静静增加了对话，用了简单的动画效果。
github：https://github.com/bee0060/Css-Paint ， 完整代码在pages/sun-house-4.html和相关的css中可以找到
demo： http://bee0060.github.io/Css-Paint/pages/sun-house-5.html
完整html如下：
![[css]我要用css画幅画(五)](/images/loading.gif)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Css Paint</title> 6 <link rel="stylesheet" type="text/css" href="../css/sun.css" /> 7 <link rel="stylesheet" type="text/css" href="../css/house.css" /> 8 <link rel="stylesheet" type="text/css" href="../css/human.css" /> 9 <link rel="stylesheet" type="text/css" href="../css/cloud.css" />10 11 <link rel="stylesheet" type="text/css" href="../css/human-animate.css" />12 </head>13 <body>14 <div class="sun">15 <div class="sun-body"></div>16 <div class="sun-shine-light sun-shine-light1"></div>17 <div class="sun-shine-light sun-shine-light2"></div>18 <div class="sun-shine-light sun-shine-light3"></div>19 <div class="sun-shine-light sun-shine-light4"></div>20 <div class="sun-shine-light sun-shine-light5"></div>21 </div>22 23 <div class="house-width house">24 <div class="house-width house-roof house-roof-left"></div>25 <div class="house-width house-roof house-roof-right"></div>26 <div class="house-width house-wall"> 27 <div class="house-wall-door"> 28 <div class="house-wall-door-handle"></div>29 </div>30 </div>31 </div>32 33 <div class="human human-pos-1">34 <p class="lines human-speak">大家好，我叫小明。</p>35 <p class="lines human-speak human-speak-delay-3">我是一个程序员，最喜欢宅在家里LOL。</p>36 <p class="lines human-speak human-speak-delay-12">静静，我们交个朋友好吗？我的电话是13800123456。</p>37 <div class="human-head-normal"></div>38 <div class="human-body-normal"></div>39 <div class="human-arms-normal"></div>40 <div class="human-legs-normal"></div>41 </div>42 43 <div class="human human-pos-2">44 <p class="lines human-speak human-speak-delay-6">大家好，我叫静静</p>45 <p class="lines human-speak human-speak-delay-9">和大家看到的一样，我热爱舞蹈。</p>46 <p class="lines human-speak human-speak-delay-15">不要，程序员什么的最讨厌了！</p>47 <div class="human-head-normal"></div>48 <div class="human-body-normal"></div>49 <div class="human-arms-normal"></div>50 <div class="human-legs-1"></div>51 </div>52 53 <div class="cloud cloud-pos cloud-pos-1">54 <div class="cloud-pos cloud-border cloud-bg cloud-top"></div>55 <div class="cloud-pos cloud-border cloud-bg cloud-left"></div>56 <div class="cloud-pos cloud-border cloud-bg cloud-right"></div>57 <div class="cloud-pos cloud-border cloud-bg cloud-bottom"></div>58 </div>59 <div class="cloud cloud-pos cloud-pos-2">60 <div class="cloud-pos cloud-border cloud-bg cloud-top"></div>61 <div class="cloud-pos cloud-border cloud-bg cloud-left"></div>62 <div class="cloud-pos cloud-border cloud-bg cloud-right"></div>63 <div class="cloud-pos cloud-border cloud-bg cloud-bottom"></div>64 </div>65 </body>66 </html>
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理：https://www.xlkjsw.com
原标题：[css]我要用css画幅画(五)
关键词：CSS
*特别声明：以上内容来自于网络收集，著作权属原作者所有，如有侵权，请联系我们：
admin#shaoqun.com
（#换成@）。
