当元素是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. contest1 CF1084 div2 oooxx oooxo ooooo

    题意: div2D (x)(x) 给出一棵树, 找出一条路径, 使得每一时刻点权和\(\ge\)边权和, 并且点权和\(-\)边权和最大 div2E (x)(o) 给出两个长度为\(n(\le 5e5 ...

  2. Flask的响应及request属性整理

    类比django框架,Response三贱客: return  HttpResponse:  return ‘xxxxxxxxxx’                 # 返回字符串 return  r ...

  3. Huffman树与Huffman编码

    1.Huffman树 今天复习Huffman树.依稀记得自己被Huffman树虐的经历.还记得是7月份,我刚开始看数据结构与算法,根本看不懂Huffman树的操作.后来我终于悟出了Huffman树是怎 ...

  4. CSS3实现PS中的蚁行线动画以及画布的马赛克背景图

    话不多说,先看例子,外链 效果截图如下: 蚁行线 马赛克背景 代码: 蚁行线代码如下: /* <!-- HTML代码 --> <div class="ant"&g ...

  5. [C#]AdvPropertyGrid的使用示例(第三方控件:DevComponents.DotNetBar2.dll)

    开发环境:Visual Studio 2019 .NET版本:4.5.2 效果如下: 1.初始化界面: 2.属性“人物”-自定义控件显示: 3.属性“地址”-自定义窗体显示: 4.属性“性别”-枚举显 ...

  6. Linux 系统开机时间及当前时间

    最近一次系统开机时间:date -d "$(awk -F. '{print $1}' /proc/uptime) second ago" +"%Y-%m-%d %H:%M ...

  7. Linux 就该这么学 CH06 存储结构与磁盘划分

    1.一切从"/"开始 linux系统中一切都是文件,而且一切文件的路径都是从根目录(/)开始的.系统中的根目录和文件名称都是严格区分大小写的,并且文件名中不能包含/符号. 绝对路径 ...

  8. win7下每次打开Excel2007都提示向程序发送命令时出现问题的解决方案

    每次打开Excel2007都提示向程序发送命令时出现问题,要打开两次才可以打开,下面介绍该问题的解决办法. 第一种情况:也就是屏蔽DDE的解决方案,这是大多数人都是这种情况,该情况的解决办法: exc ...

  9. Linux内核文档翻译——sysfs.txt

    sysfs - _The_ filesystem for exporting kernel objects. sysfs – 用于导出内核对象(kobject)的文件系统 Patrick Mochel ...

  10. spring boot Websocket

    本文只作为个人笔记,大部分代码是引用其他人的文章的. 参考: https://blog.csdn.net/moshowgame/article/details/80275084 在springboot ...