pywebio如何实现网页排版居中
时间: 2023-09-03 22:16:46 浏览: 197
多彩排版网页模板
PyWebIO 支持使用 CSS 样式来控制页面排版,可以通过添加样式表来实现网页排版居中。
以下是一个基本的例子,可以实现网页水平和垂直居中:
```python
from pywebio.input import *
from pywebio.output import *
from pywebio import start_server
def main():
put_html('<div class="wrapper"><h1>Hello World!</h1></div>')
if __name__ == '__main__':
# 添加样式表
set_env(title='Centered Page')
add_css('''
.wrapper {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
''')
start_server(main)
```
在这个例子中,我们使用了 `display: flex` 属性来让包含内容的 `div` 元素居中,`justify-content: center` 设置水平居中,`align-items: center` 设置垂直居中。`height: 100vh` 控制元素的高度,使其占满整个页面。
你可以根据需要调整样式表的属性,来实现不同的排版效果。
阅读全文