码迷,mamicode.com
首页 > 其他好文 > 详细

后端框架与选择器

时间:2019-12-27 16:44:36      阅读:127      评论:0      收藏:0      [点我收藏+]

标签:tle   size   style   title   round   伪类   char   字体颜色   post   

后段框架

表单标签:
form表单:
关键性属性:
       action
      控制的数据的提交路径:
          1.不写: 默认朝当前页面所在的地址提交
               2.全路径:
               3.后缀:(/index/
       methon:
           控制提交方式
           form表单默认是get请求 methon=‘get‘
           也可以指定post请求 methon=‘post‘
       enctype
      控制表单数据提交的编码格式
           默认form表单是不能够直接发送文件
           如果想要发送文件必须将该参数urlencoded改为formdata
       input 注意事项:
      1.获取用户输入的标签,就是用value属性来存放用户的输入
          获取用户输入的标签都因该由name属性 类似于字典的key value属性就相当于字典中的value
            2.如何增加默认属性
          可以直接给input标签加value
            3.input框设置提示信息:
          加上placeholder=‘提示内容‘
 验证form表单的提交数据
后端框架
  Django
      Flask
           Tornado
 Flask框架:pip3 install Flask
 get请求可以携带参数,但是携带的参数都是直径二跟在url之后
   url?sssss=ssss&sssss=ddddd&sss=OOO
   特点:
  1.数据全是明文
       2.数据大小有限制 大概在4kb左右的数据
       3.get请求不应该携带隐私信息
           
CSS
层叠样式表,用来调节标签的样式
   css注释: /* */
   注释的使用: css应该是一个独立的文件
   css语法结构:
  选择器(属性名:属性值;)
   CSS的三种引入方式
   1.外部css文件
   2.head内style标签内部直接书写css代码
   3.标签内部通过style属性直接写对应的样式
CSS选择器分类
基本选择器
   组合选择器
   属性选择器
  所有的标签都可以有默认的属性、
      id
           class
           标签还可以有自定义的属性,并且可以有多个
           
   分组嵌套
   伪类选择器
   伪元素选择器
   
?

书写Flask客户端:

from flask import Flask,request   #导入模块
app = Flask(__name__)  #调用模块
@app.route(‘/index‘,methods=[‘GET‘,‘POST‘])
def xxx():
   print(request.form) 打印form表单
   print(request.files) 打印files文件
   file_obj = request.files.get(‘heihei‘) 获得一个文件对象
   file_obj.save(‘高手.png‘) 保存文件
   return ‘耿耿是傻逼‘ 发送完毕后返回一句话
app.run()

css的三种用法:

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Title</title>
   <link rel="stylesheet" href="mycss.css"> #导入外部模块
   <style>
       /*p{color: blueviolet}*/
   </style> #head内通过style书写
</head>
<body>
<p>我有一根大香肠</p>
<!--<P style="color: blue"> 人活这一辈子不就为了两口吃的吗</P>--> #标签内通过style直接书写(不推荐)
</body>
</html>

基本选择器

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Title</title>
   <style>
       div { color: blue;}
       /* 将div的改为蓝色 */
       .c1{color: crimson;}
       /* c1类的文本改为红色 */
       #d1 {color: black;}
       /* id为的的改为黑色 */
      * {color: darkgreen;}
       /* 所有的文本改为绿色*/
   </style>
</head>
<body>1
<div class="c1"> c1:你好给我来个NB点的香肠
   <span>我是内部香肠</span>
</div>
<p id="d1" class="c1">d1c1: 我是血红肠,很高你来吃我</p>
<div> div你好我是蘑菇肠,请吃我吧</div>
<span class="c1">c1:鸡肉肠出来接客啦</span>
<p>来客五位,楼上请</p>
<div>   <span id="d2">d2:米酒肠出来接客快点</span>
</div>
</body>
</html>
优先级:id选择器>.类选择器>div元素选择器>*通用选择器

组合选择器

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Title</title>
   <style>
       /*div p{color: blue;}*/
       /*!*后代选择器div内部*!*/
       div >span{color:crimson }
       /*!*儿子选择器内部*!*/
       /*div +p{color: aliceblue}*/
       /*!*毗邻钻择期div紧挨着的下一个*!*/
       /*div ~p{color: greenyellow}*/
       /*!*弟弟选择器,同级别下面所有*!*/
   </style>
</head>
<body>
<p>div上的p</p>
<p>div上的p</p>
<div>
   <span>div内部的p</span>
       <p>
           <span>它事实上</span>
       </p>
   <span>好吧</span>
</div>
<p>div下面的p</p>
<p>123456</p>
<div>妹妹救我
   <span>哥哥快来舔我
       <span>12345</span>
   </span>
</div>
<p>要死了</p>
<p>123</p>
</body>
</html>
?

属性选择器

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Title</title>
   <style>
       /*属性选择器*/
      [username]{background-color: crimson}
       /*含有username的改为红色*/
      [username=‘耿耿‘]{background-color: fuchsia}
       /*含有username=耿耿的改为粉红*/
       input[username=‘耿耿‘]{background-color: blue}
       /*含有输入username=耿耿的改为蓝色*/
   </style>
</head>
<body>
?
名字:<input type="text" username="耿耿">
名字:<input type="text" username="耿耿于怀">
名字:<input type="text" username="怀耿于心">
<p username="耿耿"> 我带我天哪</p>
<p username="heihei"> sslsldld]d</p>
<p username="最美小美女">上的方法适当方式</p>
</body>
</html>
优先级:input username> username=> username

分组嵌套

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Title</title>
   <style>
      div{color: blue}
      /*将div内部的字体颜色改为蓝色*/
      p{color: fuchsia}
      /* 将p里面的文字改为粉红*/
      span{color: greenyellow}
      /*将span里的文字改为黄绿色*/
      div,p,span{color: aqua}
      /* 将div,p,span里的文字改为青蓝色*/
      .c1,#d1,p{color: crimson}
      /* 将c1 类,id=d1,p中的文字改为红色*/
       .c1 h1{color: lime}
       /*将c1类中h1里面的文字改为草绿色*/
   </style>
</head>
<body>
<div class="c1">好冷啊
   <h1>下雨了</h1>
</div>
<span id="d1">冻脚啊</span>
<p>放学了</p>
</body>
</html>

伪类选择器

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Title</title>
   <style>
       a:link{color:red }
       /*没点击过的是红色*/
       a:hover{color: cyan}
       /*悬浮连接变成青蓝色*/
       a:active{color: blue}
       /*长按是蓝色*/
       a:visited{color: lightcyan}
       /*点击过的变成灰白色*/
       input:focus{background-color: greenyellow}
       /*点击输入框变成草黄色*/
   </style>
</head>
<body>
<a href="https://www.baidu.com">百度</a>
<a href="https://www.mzitu.com">妹子图</a>
<a href="https://www.sogou.com">搜狗</a>
<a href="https://www.4399.com">4399</a>
<a href="https://www.baihe.com">百合</a>
<input type="text">
</body>
</html>

伪元素选择器

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <STYLE>
        P:first-letter{color: blue; font-size: 50px}
        /*将首字符改为蓝色且大小为50px*/
        p:before{content: ‘你好啊‘; color: cyan}
        /*在语句前面添加(你好啊)三个字*/
        p:after{content: ‘?‘;color: darkcyan}
        /*在语句后面添加*/
    </STYLE>
</head>
<body>
<p>我有一根大香肠</p>
</body>
</html>
注意:以此方法添加的字段均不可选中。

后端框架与选择器

标签:tle   size   style   title   round   伪类   char   字体颜色   post   

原文地址:https://www.cnblogs.com/cyfdtz/p/12108062.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!