我遇到的问题:

   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. 画布Canvas 画笔Paint

    package com.example.m_evolution.View; import android.content.Context; import android.graphics.Canvas ...

  2. CodeForces 900D Unusual Sequences

    题目链接: https://codeforces.com/contest/900/problem/D 题意 假设有distinct 正整数序列{a1,a2,,,an},满足gcd(a1, a2, .. ...

  3. 内网ssh穿透

    公司服务器没有公网IP,只有内网IP,利用自己的阿里云服务器(有公网ip)做ssh内网穿透,使得外网可访问.方法如下: 环境: 公司服务器和阿里云服务器均为 Ubuntu 操作系统, 需要修改阿里云服 ...

  4. android一个app打开另一个app的指定页面

    一个app打开另一个app的指定页面方法 有以下几种 1.通过包名.类名 2.通过intent的 action 3.通过Url 方案1. ComponentName componentName = n ...

  5. Centos 7创建一个服务

    首先创建服务文件 vim /etc/systemd/system/node.service #内容如下 [Unit] Description=ethereum-go Monitor Daemon Af ...

  6. ElasticSearch聚合(转)

    ES之五:ElasticSearch聚合 前言 说完了ES的索引与检索,接着再介绍一个ES高级功能API – 聚合(Aggregations),聚合功能为ES注入了统计分析的血统,使用户在面对大数据提 ...

  7. 基于SRS+OBS搭建直播系统

    这段时间与视频,直播相关的技术不可谓不热,今天我们就近距离接触下,尽早搭上这班车! 我们先看一张效果图 左边是OBS 推流端,右边是VLC播放器,稍微有延迟! 本文是基于VMware(12.5.7)+ ...

  8. Similarity measure

    1. https://blog.csdn.net/m0_37676632/article/details/68936157 2. https://www.cnblogs.com/pinard/p/62 ...

  9. ASP .NetCore 部署500错误 查看异常详情

    部署.net core 网站后,访问报错:500 按照教程设置完成,但访问时总是提示 服务器内部错误,没有详细的异常信息,无从下手. 解决办法: 1.在站点根目录下按住shift+鼠标右键,选择在此处 ...

  10. Scrapy运行ImportError: No module named win32api错误

    windows系统上出现这个问题的解决需要安装Py32Win模块,更方便的做法是: pip install pypiwin32