我遇到的问题:

　　　div盒子标签设置了伪元素 ::after  ::before  并给这俩content内容设置了空属性，添加了背景图，发现这两个伪元素没有宽度和高度。

解决方法

　　　给设置伪元素的盒子的父级盒子添加position:relative;width:200px;height:200px,带有伪元素的盒子添加position:absolute;，

　　　然后带有伪元素的盒子有了宽度和高度.

为什么会这样？

　　由于手头上有项目要写，暂时不去理解这个问题。

css伪元素 ::after ::before的更多相关文章

  1. jQuery如何改变css伪元素样式

    首先我们看一下css伪元素是什么: CSS 伪元素用于向某些选择器设置特殊效果. 伪元素有哪些: :first-line 伪元素:"first-line" 伪元素用于向文本的首行设 ...

  2. css 伪元素分享！！！

    最近接触到的css 伪元素觉得还算不错 分享下: 1.清楚内盒浮动设置: ;} .back_list ul:after{;visibility: hidden;}/*清楚内盒浮动设置*/ 2.伪元素a ...

  3. CSS伪类与CSS伪元素的区别及由来

    关于两者的区别,其实是很古老的问题.但是时至今日,由于各种网络误传以及一些不负责任的书籍误笔,仍然有相当多的人将伪类与伪元素混为一谈,甚至不乏很多CSS老手.早些年刚入行的时候,我自己也被深深误导,因 ...

  4. (六)CSS伪元素

    CSS伪元素用于向某些选择器设置特殊效果. 伪元素的用法和伪类相似: selector:pseudo-element {property:value;} CSS类也可以与伪元素配合使用: select ...

  5. CSS 伪元素

    CSS伪元素是用来添加一些选择器的特殊效果. 语法 伪元素的语法: selector:pseudo-element {property:value;} CSS类也可以使用伪元素: selector.c ...

  6. css伪元素

    CSS 伪元素用于向某些选择器设置特殊效果. 1.:first-line 伪元素  "first-line" 伪元素用于向文本的首行设置特殊样式.注意:"first-li ...

  7. js如何控制css伪元素内容（before，after）

    曾经遇到的问题,在对抗UC浏览器屏蔽需要把内容输出到css 伪元素中输出.有个疑问如何用js控制它.于是在segmentfault提问,如下是对问题的整理: 如何用js控制css伪类after 简单粗 ...

  8. css伪元素用法大全

    本文主要讲解css伪元素的用法,有需要的朋友可以阅读此文.本文讲解的伪元素有:before,after. 什么是伪元素(Pseudo element)? 伪元素不是真正的元素,不存在与文档之中,所以j ...

  9. js分析 汽_车_之_家 js生成css伪元素 hs_kw44_configUS::before

    0.参考 https://developer.mozilla.org/zh-CN/docs/Web/CSS/Pseudo-elements https://developer.mozilla.org/ ...

  10. CSS伪元素before、after妙用

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. React forwardRef：跳转引用

    一 在DOM组件中使用 import React, { Component } from 'react'; // 跳转引用对象本身并不关心ref,而是由渲染函数转发ref const FancyBut ...

  2. python完整课程

    python完整课程 python课程概述 python课程大纲 链接:http://www.cnblogs.com/lx63blog/articles/9054294.html 课程结构: 1.安装 ...

  3. jquery全选的选中和取消选中

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  4. 七牛存储qshell工具

    ---恢复内容开始--- 工具地址:https://developer.qiniu.com/kodo/tools/1302/qshell 下载完成后:根据自己的系统选择需要的可执行文件,支持linux ...

  5. AOP-事物管理

    1. Spring AOP 模块为基于 Spring 的应用程序中的对象提供了事务管理服务

  6. LINUX中printf与echo的区别

    (1)首先echo是回显,即代表回车显示,是自带换行的:而printf只是打印出来,没有换行(2)echo只是回显没有变量替换功能:printf是有的举例:假如我们定义好变量a='hello worl ...

  7. java用POI操作excel——随便写一下，最基础的东西

    前两天部门实施在做一个东西,需要把客户放在Excel中的数据导入到Oracle数据库中,我就想着直接写一个模板,必要的时候改一下实体类应该可以解放实施同事的双手,不过在实际写的过程中,还是碰到很多问题 ...

  8. 天然气管道Gaz[POI2007]

    --BZOJ1034 题目描述 Mary试图控制成都的天然气市场.专家已经标示出了最好的天然气井和中转站在成都的地图.现在需要将中转 站和天然气井连接起来.每个中转站必须被连接到正好一个钻油井,反之亦 ...

  9. pd 注意事项

  10. PCL安装

    本文是在Ubuntu16.04下安装PCL. 按照官网的教程,有两种方法可以安装: 1.直接安装预先编译好的二进制库文件 sudo add-apt-repository ppa:v-launchpad ...