在static下新建一个css,并写入内容

/*标签选择器,label标签的颜色为红色*/
label {
color: red;
} /*.代表类选择器,绿色*/
.test {
color: green;
} /*#代表id选择器,黄色*/
#test {
color: yellow;
} /*div标签下的魔偶写标签下的lable标签(相对关系),内容的颜色为蓝色*/
div label {
color: blue;
} /*div标签下的直接的lable标签(父子关系),,灰色*/
div > label {
color: gray;
} /*属性选择器,href属性,橙色*/
[href] {
color: orange;
}

在templates下建一个html文件,并引入刚刚创建的css文件

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
<link rel= "stylesheet" href= "/static/selector.css">
</head>
<body>
<label>这里是标签选择器(应该为红色)</label>
<label class= "test">这里是类选择器(应该为绿色)</label>
<label id= "test">这里是ID选择器(应该为黄色)</label>
<div>
<a href= "http://www.baidu.cn">
<label>1(蓝色)</label>
</a>
<label>2(灰色)</label>
</div>
</body>
</html>

在工程下创建路由

from flask import Flask
from flask import render_template app = Flask(__name__) @app.route('/calc')
def calc():
return render_template('calc.html') if __name__ == '__main__':
app.run(
host='0.0.0.0',
port=8888,
debug=True,
)

访问:

测开之路三十六:常用的css选择器的更多相关文章

  1. 测开之路三十四:html常用标签

    网页的结构: HTML:超文本标记语言是迄今为止网络上应用最为广泛的语言,也是构成网页文档的主要语言.HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字.图形.动画.声音.表格.链 ...

  2. 测开之路七十六:性能测试蓝图之html

    <!-- 继承base模板 -->{% extends 'base.html' %} {% block script %} <!-- 从cdn引入ace edter的js --> ...

  3. 测开之路三十八:css布局之定位

    常用的布局方式: static:静态定位(默认),什么都不用管,元素会按照默认顺序排列,排不下是会默认换行relative:相对定位(同一层),相对于某一个元素进行定位fixed:绝对定位,指定位置a ...

  4. 测开之路八十六:python操作sqlite

    创建sqlite数据库,并创建表和数据 python自带sqlite3库可以创建数据库文件 导入库:import sqlite3 创建游标,指定数据库名字:con = sqlite3.connect( ...

  5. 测开之路七十六:linux变量和环境变量

    变量 赋值 variable=0,访问 $var或${var} 参数 $n 用``引住的会先执行(~键) 位置参数 环境变量/etc/profile:全局的环境变量 . bash_profile:用户 ...

  6. 测开之路五十六:实现类似unittest的断言

    import inspect class Case(object): """ 实现断言 """ def __init__(self): se ...

  7. 测开之路三十九:js基础

    js的两种使用方式 第一种使用方式:单独写js文件 在static下新建一个js文件并写入内容 alert('这是一个弹窗'); 在html文件里面,用script标签引入 <script sr ...

  8. 测开之路三十五:css引入

    CSS是一种定义样式结构,如字体.颜色.位置等的语言,被用于描述网页上的信息格式化和现实的方式.CSS样式可以直接存储于HTML网页或者单独的样式单文件.无论哪一种方式,样式单包含将样式应用到指定类型 ...

  9. 测开之路三十二:Flask基础之错误与重定向

    错误处理,框架默认的错误为:not Found 可以捕获,并自定义 准备一张自定义图片,放在static文件夹下,并在template下创建一个html文件,引用该图片 捕获404状态,返回自定义页面 ...

随机推荐

  1. python学习那点事---pycharm使用弹框问题如何解决

    学习python的目标:年后可以找一份不错的维护工作. 2019.11.4日是第一天开始学习python,从开始安装python3.6版本和pycharm开始.安装python版本非常顺利的就完成了, ...

  2. JavaWeb学习——session总结

    一.session简介 sesion也就是会话,Session对象存储特定用户会话所需的属性及配置信息.这样,当用户在应用程序的Web页之间跳转时,存储在Session对象中的变量将不会丢失,而是在整 ...

  3. CSS选择器,优先级的总结

    CSS选择器 css选择器种类 基本选择器: 通配符选择器 * id选择器 #id 类选择器 .className 元素选择器 E 元素后代选择器  E F 子元素选择器 E > F 相邻兄弟元 ...

  4. DP50题(转)

    转自https://www.luogu.org/blog/cccx2016/dp50-ti-ti-hao dp50题: poj1014 poj1015 poj1018 poj1036 poj1038 ...

  5. Yii中CreateUrl的使用总结

    在Yii中经常要生成URL,不管是为了自动跳转还是仅仅是一个链接.下面对Yii中的URL生成做了一个总结.提示:以下controllerX代表控制器X,actionX代表方法X.在Controller ...

  6. SR-IOV

    SR-IOV 来源 http://blog.csdn.net/liushen0916/article/details/52423507 摘要: 介绍SR-IOV 的概念.使用场景.VMware 和 K ...

  7. JS中的匿名函数、回调函数、匿名回调函数

    工欲善其事必先利其器 在学习JavaScript设计模式一书时,遇到了“匿名回调函数”这个概念,有点疑惑,查找了些资料重新看了下函数的相关知识点之后,对这个概念有了认识.九层之台,起于垒土.在熟悉这一 ...

  8. rabbitMQ实现推迟队列

    一. 使用原生Api 1.RabbitMQ 相关 <dependency> <groupId>com.rabbitmq</groupId> <artifact ...

  9. 牛客多校第10场J Wood Processing 分治优化/斜率优化 DP

    题意:你有n块木头,每块木头有一个高h和宽w,你可以把高度相同的木头合并成一块木头.你可以选择一些木头消去它们的一部分,浪费的部分是 消去部分的高度 * 木头的宽度,问把n块木头变成恰好m块木头至少要 ...

  10. 笔记--NS_SWIFT_NAME与@objc区别与用途

    swift中使用Selector经常要在方法前面添加@objc,除了默认的@objc,其实我们还可以添加自己制定的swift中调用的函数名 @objc(pushToControllerName:par ...