【代码笔记】Web-CSS-CSS伪元素

一,效果图。

二,代码。

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>CSS 伪元素</title>
    <style>
    p:first-line {
        color: #ff0000;
        font-variant: small-caps;
    }

    p:first-letter {
        color: #ff0000;
        font-size: xx-large;
    }

    h1:before {
        content: url(smiley.gif);
    }

    h1:after {
        content: url(smiley.gif);
    }
    </style>
</head>

<body>
    <h1>This is a heading</h1>
    <p>第一行</p>
    <p>第二行</p>
</body>

</html>

参考资料:《菜鸟教程》

(0)

相关推荐

  • 7月底HTML/CSS学习笔记大纲

    一夜无眠,学习不是为了别人,自己执行力好差,对自己过高期望,以为任务目标Soeasy,结果徘徊了几个月,还是在原地踏步,怎么讲了?学习还是要脚踏实地,专注,不要为自己找借口!毕竟虚长几岁,曾经的年少轻 ...

  • Python爬虫入门,快速抓取大规模数据(第二部分)

    通过第一部分的练习,我们已经有了一个可运行的爬虫.这一部分我们详细的看看如何使用BeautifulSoup从网页中提取我们需要的数据,学习的目标是能够使用BeautifulSoup从网页中提取任意的数 ...

  • [周汇总] 前端面试每日3+1(周汇总2020.01.19)

    <论语>,曾子曰:"吾日三省吾身"(我每天多次反省自己). 前端面试每日3+1题,以面试题来驱动学习,每天进步一点! 让努力成为一种习惯,让奋斗成为一种享受! 相信 坚 ...

  • CSS伪元素:before和:after详解与妙用

    定义 ::before 创建一个伪元素,其将成为匹配选中的元素的第一个子元素.常通过 content 属性来为一个元素添加修饰性的内容.::after用来创建一个伪元素,作为已选中元素的最后一个子元素 ...

  • CSS伪元素

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta na ...

  • WEB之CSS系列笔记

    CSS,通常称为CSS样式表或层叠样式表(级联样式表).主要用于设置HTML页面中的文本内容(字体.大小.对齐方式等).图形的外形(宽高.边框样式.边距等)以及版面布局和外观显示样式. 引入CSS样式 ...

  • [css] 第91天 CSS的伪类和伪对象有什么不同?

    今日试题: CSS的伪类和伪对象有什么不同? 此开源项目四大宗旨:勤思考,多动手,善总结,能坚持 <论语>,曾子曰:"吾日三省吾身"(我每天多次反省自己). 前端面试每 ...

  • 【CSS】absolute 元素完全居中的两种方法

    方法一:(不能微调) position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; 方法二:(可微调) position:abso ...

  • 编程语言CSS使用伪选择器制作箭头图标_html/css_WEB-ITnose

    // 使用Transform的属性,组合translate(位移)和rotate(旋转),将生成的小矩形组合成各种箭头样式: HTML 12图标变形过渡效果缩放式菜单34图标56 #300x100 淡 ...

  • 编程语言详解css绝对定位对元素宽度的影响

    一.问题来源 自己编写轮播图切换的时候前一幅图滑动时后边出现空白直到前一幅图全部滑出后第二幅图才出现.刚开始出现问题到网上搜发现有的说定时器动画可能会造成这种情况,于是我在代码调试里注释掉了定时器,让 ...

  • 理解伪元素 :before 和 :after

    英文:Thoriq Firdaus  译文:听海阁 tinghaige.com/2013/09/17/understanding-pseudo-element-before-and-after/ 层叠 ...

  • 以杨维桢为中心的小说作家群,及元人笔记中的“水浒”元素

     绍兴文理学院教授佘德余先生提出"<水浒传>的作者可能是杨维桢",这为深入研究<水浒传>作者打开了广阔的天地.近年来,围绕佘德余教授的观点,诸暨.萧山方面做 ...