当元素是q的时候，可以无需使用::after或者::before选择器，直接就可以为q元素的内容添加标记元素。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style type="text/css">

        q {

            quotes: '+' '-'

        }

    </style>

</head>

<body>

    <q>蚂蚁部落欢迎您</q>

</body>

</html>

运行结果：

但是当不是q标签时，如div是不起效果。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style type="text/css">

        q {

            quotes: '+' '-'

        }

    </style>

</head>

<body>

    <div>蚂蚁部落欢迎您</div>

</body>

</html>

div要传统的加::before、::after选择器。

css q标签和quotes属性的使用的更多相关文章

  1. CSS中quotes属性以及content的open（close）-quotes属性

    定义和用法 quotes 属性设置嵌套引用(embedded quotation)的引号类型. 可能的值 值 描述 none 规定 "content" 属性的 "open ...

  2. 区别CSS中display：box；inline；none以及HTML中 <frame> 标签<table> 标签的 frame 属性

    区别display:box:display:inline:display:none三者的不同 display:block的特点是: block是Display默认的值.总是在新行上开始:该对象随后的内 ...

  3. python 全栈开发，Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

  4. HTML&CSS基础-标签的属性

    HTML&CSS基础-标签的属性 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!-- html 根标签,一个页面中有且只有一个根标签,网页中的 ...

  5. CSS常用标签

    CSS常用标签 一 CSS文字属性 color : #999999; /*文字颜色*/ font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; / ...

  6. HTML5 <a>标签的ping属性用法

    随着移动互联网用户井喷式的增长,web前端开发中的HTML5在近几年备受瞩目,越来越多的人从事html5开发相关工作.今天小编也来凑个热闹,和大家一起来谈谈HTML5中<a>标签的ping ...

  7. css中的7中属性选择器

    在CSS的选择符中有七个属性选择符.它们分别是: 1.E[att] 选择具有att属性的E元素. 2.E[att="val"] 选择具有att属性且属性值等于val的E元素. 3. ...

  8. img标签和 background 属性的使用分析

    在网页布局中引入图片,最常用的两个就是 img 标签和 background 属性了.但何时使用 img 标签,何时使用 backround 背景图像呢? <img> 标签定义 HTML ...

  9. HTML5 超链接：a标签的href 属性

    H5中a标签的 href 属性用于指定超链接目标的 URL,这里主要给大家介绍一下 href 属性的定义和用法以及应用实例. 定义和用法: <a> 标签的 href 属性用于指定超链接目标 ...

随机推荐

  1. Pandas | 14 统计函数

    统计方法有助于理解和分析数据的行为.可以将这些统计函数应用到Pandas的对象上. pct_change()函数 系列,DatFrames和Panel都有pct_change()函数.此函数将每个元素 ...

  2. graalvm native image 试用

    graalvm 提供的native 模式,可以加速应用的启动,不同可以让应用不再依赖jvm 运行时环境,但是 也有一些限制 参考 https://github.com/oracle/graal/blo ...

  3. 第03组 Beta冲刺（4/4）

    队名:不等式方程组 组长博客 作业博客 团队项目进度 组员一:张逸杰(组长) 过去两天完成的任务: 文字/口头描述: 制定了初步的项目计划,并开始学习一些推荐.搜索类算法 GitHub签入纪录: 暂无 ...

  4. ZROI 暑期高端峰会 A班 Day6 DP

    [THUPC2018]城市地铁规划 (日常讲题之前 YY--) 一眼出 \(O(n^3+nk)\) 做法. \(dp[i][j]\) 表示前 \(i\) 个点,前 \(i\) 个点度数和为 \(j\) ...

  5. pycharm默认注释与快捷键功能

    pycharm快捷键使用技巧 Ctrl+d 复制当前行.或者选择的块Ctrl+n 跳转到类Ctrl+shift+n 快速查找文件名Ctrl+shift+f 全局查找,快速查找关键字的文件Ctrl+sh ...

  6. Spring Cloud 升级最新 Greenwich 版本，舒服了~

    去年将 Spring Cloud 升级到了 Finchley 版本: Spring Cloud 升级最新 Finchley 版本,踩了所有的坑! 这个大版本栈长是踩了非常多的坑啊,帮助了不少小伙伴. ...

  7. 图、流程图、ER图怎么画及常见画图工具（流程图文章汇总）

    流程图基本符号 首先要记住图中1.2.3.4.6这几种符号. 图片摘自网络 流程图基本概念及入门 简易流程图 流程图简介(基本符号与绘制工具) 你可能学了假流程图,三步教会你绘制大厂流程图 使用流程图 ...

  8. MPI linux Ubuntu cluster 集群

    在局域网内安装mpi,并进行并行计算.MPICH3. 下载源码: wget http://www.mpich.org/static/downloads/3.3.1/mpich-3.3.1.tar.gz ...

  9. SpringBoot 系列教程 JPA 错误姿势之环境配置问题

    191218-SpringBoot 系列教程 JPA 错误姿势之环境配置问题 又回到 jpa 的教程上了,这一篇源于某个简单的项目需要读写 db,本想着直接使用 jpa 会比较简单,然而悲催的是实际开 ...

  10. Windows下安装 Linux 下vim编辑器

    Windows下安装vim编辑器 下载传送门 https://vim.en.softonic.com/download# 开始安装 这是下载后的可执行文件 双击(或单击)运行软件,选择同意继续进行安装 ...