python前端开发

前端开发

快速网站开发

复制代码
from flask import Flask
app=Flask(__name__)
#创建网址/show/info 和函数index的对应关系,
#访问网站,执行index()函数
@app.route("/show/info")
def index():
    return "中国联通"
if __name__=="__main__":
    app.run()

标签

标签<h>P

a行内标签,默认设置高度,边距无效

title
div和span
复制代码
<div>内容</div>
<div>span</div>
<!--内容占一行-->
<!--span-->
<!--这是注释-->
复制代码
<!--自已有多大,就占多少地方-->
<body>
    <span style="color:red">七千大大</span> <span>霓虹</span>
</body>
超链接
复制代码
<a href="/show/new">点击查看</a>
​
图片
复制代码
网上照片
<img src="https://tse4-mm.cn.bing.net/th/id/OIP-C.L6nEl_FM6qCV8u5n9ZbQUwHaH5?rs=1&pid=ImgDetMain"/>
自己图片
创建目录static,将图片放在目录下
引入图片
    <img src="/satic/aaa.png"/>
    <img style="height:200px" src="https://tse4-mm.cn.bing.net/th/id/OIP-C.L6nEl_FM6qCV8u5n9ZbQUwHaH5?rs=1&pid=ImgDetMain"/>
设置高度和宽度
     <img style="height:200px;weight:300px" src="/static/美女.png"/>
设置百分比,图片大小是原来的百分之几
     <img style="height:10% rc="/static/美女.png"/>
​
​
复制代码
块级标签
    <h1></h1>
    <div></div>
行内标签
    <span></span>
    <a></a>
    <img />
嵌套
<div>
    <span>xxx</span>
    <
</div>
复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<a href="https://www.3dmgame.com/gl/3826462.html" target="_blank">
<img src="/static/ganyu.png"/>
    <span> 为何人们总是拼命证明...</span>
</a>
<a href="https://www.3dmgame.com/gl/3826459.html" target="_blank">
​
<img src="/static/hutao.png"/>
    <span>太阳出来我晒太阳,月亮出来我晒月亮咯——!</span>
</a>
<a href="https://www.3dmgame.com/gl/3834188.html" target="_blank">
<img src="/static/wanye.png"/>
    <span>既然手边有树叶,我可以为你吹奏一曲。如何?愿意听听吗?</span>
</a >
</body>
</html>
复制代码
列表相关的标签
<ul>
    <li>中国联通</li>
    <li>中国移动</li>
    <li>中国电信</li>
</ul>
有序列表
<ol>
    <li>中国联通</li>
    <li>中国移动</li>
    <li>中国电信</li>
</ol>
​
表格标签
复制代码
<table border="1">
    #表头
    <thead>
        <tr>  <th>ID</th>  <th>姓名</th> <th>年龄</th></tr>
        
    </thead>  
  <tbody>
      <tr> <td>10</td> <td>呆呆</td> <td>10</td> </tr>
      <tr> <td>10</td> <td>呆呆</td> <td>10</td> </tr>
      <tr> <td>10</td> <td>呆呆</td> <td>10</td> </tr>
    </body>
</table>
input标签系列
复制代码
#输入用户名  
<input type="text">
#输入密码
<input type="password">
#上传文件
<input type="file">
#单选框,name相同则互斥,智能选择一个,后面可以加上信息
<input type="radio" name="n1">男
<input type="radio" name="n1">女
#复选框,可以同时选择多个
<input type="checkbox">篮球
<input type="checkbox">足球
<input type="checkbox">棒球
#提交按钮
<input type="button" value="提交">
<input type="submit" value="提交">
下拉框
复制代码
#单选下拉框
<select>
    <option>北京</option>
    <option>上海</option>
    <option>河南</option>
</select>
#多选下拉框,选中一个,按Shift或Ctrl再次选择
<select multiple>
    <option>濮阳</option>
    <option>郑州</option>
    <option>鹤壁</option>
</select>
多行文本
相关推荐
Wect14 分钟前
React 性能优化精讲
前端·react.js·性能优化
追风筝的人er1 小时前
SpringBoot+Vue3 企业考勤如何处理法定假期?节假日方案、调休补班与工作日判断链路拆解
前端·vue.js·后端
无敌的黑星星1 小时前
Java8 CompletableFuture 实战指南
linux·前端·python
雁鸣零落1 小时前
如何在 Chrome 中查看其他浏览器的书签?书签空间订阅与侧边栏只读切换指南
前端·chrome·edge浏览器
hpoenixf2 小时前
一天上线 + 零返工:我如何给复杂前端需求建立“安全感”
前端
广州华水科技2 小时前
单北斗GNSS变形监测系统在水利工程安全保障中的应用与优势分析
前端
yqcoder3 小时前
CSS 外边距重叠(Margin Collapsing):现象、原理与完美解决方案
前端·css
山楂树の3 小时前
图像标注大坑:img图片 + Canvas 叠加标注,同步放大后标注位置偏移、对不齐?详解修复方案及亚像素处理原理
前端·css·学习·canva可画
本山德彪3 小时前
我做了一个拼豆图纸生成器,把照片秒变图纸
前端
DTrader4 小时前
用TS无法实盘量化? - 实盘均线策略
前端·api