作者：Be_melting
项目2: 使用列表解析式动态生成页面
[1] 新建一个py文件，然后搭建框架
import dash
from dash import html
app = dash.Dash() #括号中也可以什么都不填
app.run_server(debug=True)
[2] 添加网页html中的信息，其中Ul就是列表的组合（这里的列表是html中的概念，不是python中的列表），添加四个列表用来存放数据。
app.layout = html.Ul(
[
html.Li('Apple'),
html.Li('Banana'),
html.Li('Grapes'),
html.Li('Pear')
]
)
添加完毕后，运行程序。刷新网址：http://127.0.0.1:8050/ ，输出结果如下。打开后一片黑色，用光标选中左上方才显示出添加的信息。原因在于做梗图的时候背景设置了黑色，为了显示出字体，后续会对背景颜色进行修改。
[3] 在进行网页中列表数据的创建时，需要一直输入html.Li()进行单个的数据元素的录入，如果数据量较多时或者是接口动态更新的数据，此时手动输入就不现实。因此可以使用列表解析式的方式来操作，具体的代码如下。
fruit_list = ['Apple','Banana','Grapes','Pear']
app.layout = html.Ul(
children=[html.Li(fruit) for fruit in fruit_list]
)
children对应的列表就变成了一个解析式的形式，批量向html中加入数据，只要是fruit_list这个变量的信息发生改变，那么对应网页的信息就自动跟着变化，从而完成动态更新。
[4] 可以对水果添加一些emoji表情，在网站上找到对应的表情进行复制粘贴，网址：https://emojipedia.org/。
比如搜索apple后回车，就会跳转到搜索结果界面，点击Red Apple，如下。
点击Copy按钮后，在编辑器中就可以直接进行粘贴，依次进行对应表情的添加，如下。
[5] 修改后进行保存，运行py文件后，刷新网址：http://127.0.0.1:8050/ ，输出结果如下。（此时背景颜色修改为pink粉红色，多用在卡通网页中）
[6] 添加动态样式。在assets文件夹下创建一个style.css文件，或者直接修改原来的样式文件，输入代码如下。
body,ul {
background-color: pink;
}
li {
color:white;
font-size: 8rem;
font-weight: bold;
transition: all 0.2s ease-in-out;
}
li:hover{
transform: scale(1.1);
}
这里的css语法可以留意一下，不需要刻意学习，后面再进行网站搭建时候都是使用的框架，别人都已经给写好了，不用自己在一点点写。修改完毕后进行保存，重新运行py文件后，刷新网址：http://127.0.0.1:8050/ ，输出结果如下。
至此整个项目2，使用列表解析式动态生成页面就介绍完毕。最核心的内容就是如何使用列表解析式来简化数据的输入，为后续的项目做铺垫。