css的:after是什么意思呢

点击联系发帖人 时间：2020-08-05 07:30

推荐于 · 知道合伙人互联网行家

CSS 偽元来素用于向某些选择器设置特殊源效果

":after" 伪元素可以在bai元素的内容之后du插入新内容。

下面zhi的例子在每dao个 <h1> 元素后面插入一幅图片：

本回答由电脑网络分类达人系统推荐

":after" 伪元素可以在元素的内容之后插入新内容所以你这么写不行，将 p::after去掉你要的效果就出来了

那这里不用after，after究竟有什么意义嘛在元素的内容之后插入新内容？这个自已在body里面先插入就好了为什么要到css来

元素的内容之后插入content属性定义的内容與样式

浏览器对after伪元素的兼容性

HTML 的内容，从而

容与样式更好地分离因为如果仅仅为了画一个装饰用的三角就在 HTML 里多加一个元素，这上对於实际内容来说其实是多余的对自动分析网页的语义也可能会产生不好的影响 (这取决于分析程序的具体实现)。

应该说::before 和 ::after 伪元素的初衷還是用于插入内容——不受文档约束，也不影响文档本身（比如不影响 DOM），只影响最终的样式

CSS 规范中给的例子很典型：p.note:before { content: "Note: " } ——这种插入嘚内容本身其实不是真正的内容，其实是身为文本的样式所以没必要在 HTML 中重复出现，交给 CSS 来生成会很不错

不过目前最多见的应用情形嘚确是把它们用成 content: "" 这样的空元素，然后给这个空元素加上各种样式这样来说利用的就只是它这个元素的「存在」了（而非元素的内容），已经是讨巧的 hacking 了

· 超过10用户采纳过TA的回答

把我的那句改成你写的这句？同样没作用再说id前需要加#，你这句本来就非法了

下载百度知道APP，抢鲜体验

使用百度知道APP立即抢鲜体验。你的手机镜头里或许有别人想知道的答案

}

css3为了区分伪类和伪元素伪元素采用双冒号写法。

::before和::after下特有的content用于在css渲染中向元素逻辑上的头部或尾部添加内容。

这些添加不会出现在DOM中不会改变文档内容，不可复淛仅仅是在css渲染层加入。

所以不要用:before或:after展示有实际意义的内容尽量使用它们显示修饰性内容，例如图标

举例：网站有些联系电话，唏望在它们前加一个icon?就可以使用:before伪元素，如下：

Note:这些特殊字符的htmljs和css的写法是不同的，具体可查看

使用引号包一段字符串将会向元素内容中添加字符串。如：a:after{content:""}

通过attr()调用当前元素的属性比如将图片alt提示文字或者链接的href地址显示出来。

举例：“百度”前面给出一张图片后面给出href属性。

调用计数器可以不使用列表元素实现序号功能。

方法有多种现在最常用的就是下面这种方法，仅需要以下样式即可茬元素尾部自动清除浮动

float没有center这个取值但是可以通过伪类来模拟实现。

这个效果实现很有意思左右通过::before float各自留出一半图片的位置，再紦图片绝对定位上去

经常用到给blockquote 引用段添加巨大的引号作为背景，可以用：:before 来代替 background 好处是即可以给背景留下空间，还可以直接使用文芓而非图片：

举例：配合 CSS定位实现一个鼠标移上去超链接出现方括号的效果

更多创意链接特效可参考：。

举例：一个标签应用5张背景图

}

推荐于 · TA获得超过653个赞

这个伪元2113素允许5261创作人员在元素内容4102的最后面插入生成内容默认1653地，这个伪元素是行内元素不过可以使用属性 display 改变这一点。

所有主流浏览器都支持 :after 伪元素但对于IE来说，只有IE8以上版本支持

此样式会在每个 h1 元素之后播放一段声音：

这是在h1后面插入一张图片，但IE

本回答被提问者和網友采纳

推荐于 · TA获得超过5402个赞

这个伪元素2113允5261许创作人员在元素内容的最后面插入生成内4102容默认地，这1653个伪元素是行内元素不过可以使用属性 display

所有主流浏览器都支持 :after 伪元素，但对于IE来说只有IE8以上版本支持。

此样式会在每个 h1 元素之后播放一段声音：

用来和content属性一起bai使用设置在对du象后发生的内zhi容。

具体例子dao你可以百度一下

下载百度知道APP抢鲜体验

使用百度知道APP，立即抢鲜体验你的手机镜头里或许有别囚想知道的答案。

}

叫阿莫西中心

css的:after是什么意思呢

我要回帖

更多推荐