<!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Title</title>

     <style>

         /*获取第一个字符：实现首字下沉*/

         p::first-letter{

             color: #bb131a;

             font-size: 30px;

             float: left;/*文本环绕*/

         }

         /*获取第一行内容：如果设置了::first-letter样式，则无法同时设置该样式*/

         p:first-line{

             text-decoration: underline;

         }

         /*来设置选中当前内容的样式*/

         p::selection{

             background-color: green;

             color: red;

             /*他州能设置显示的样式，二不能设置内容大小

             比如:font-size:30px;

             */

         }

     </style>

 </head>

 <body>

 <p>假如生活欺骗了你，<br>不要悲伤，不要心急，<br>因为明天他还骗你</p>

 </body>

 </html>

效果图

h5-其他伪元素的更多相关文章

  1. css伪类选择器及伪元素选择器

    1.类选择器 在css中可以使用类选择器把相同的元素定义成不同的样式.比如: 结果如下: 标题背景未变 2.伪类选择器 类选择器和伪类选择器的区别在于,类选择器我们定义的,而伪类选择器是CSS中已经定 ...

  2. python 全栈开发，Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

  3. css伪类和伪元素的区别，:before和::before的区别

    伪类用于选择DOM树之外的信息,或是不能用简单选择器进行表示的信息.前者包含那些匹配指定状态的元素,比如:visited,:active:后者包含那些满足一定逻辑条件的DOM树中的元素,比如:firs ...

  4. 【CSS进阶】伪元素的妙用--单标签之美

    最近在研读 <CSS SECRET>(CSS揭秘)这本大作,对 CSS 有了更深层次的理解,折腾了下面这个项目: CSS3奇思妙想 -- Demo (请用 Chrome 浏览器打开,非常值 ...

  5. 【CSS进阶】伪元素的妙用2 - 多列均匀布局及title属性效果

    最近无论是工作还是自我学习提升都很忙,面对长篇大论的博文总是心有余而力不足,但又不断的接触学习到零碎的但是很有意义的知识点,很想分享给大家,所以本篇可能会很短. 本篇接我另一篇讲述 CSS 伪元素的文 ...

  6. CSS3与页面布局学习总结（六）——CSS3新特性（阴影、动画、渐变、变形、伪元素等）

    CSS3在CSS2.1的基础上新增加了许多属性,这里选择了较常用的一些功能与大家分享,帮助文档中有很详细的描述,可以在本文的示例中获得帮助文档. 一.阴影 1.1.文字阴影 text-shadow&l ...

  7. 浅谈css的伪元素::after和::before

    css中的::after和::before已经被大量地使用在我们日常开发中了,使用他们可以使我们的文档结构更加简洁.但是很多人对::after和::before仍不是特别了解,究竟他们是做什么的?如何 ...

  8. Effective前端4：尽可能地使用伪元素

    伪元素是一个好东西,但是很多人都没怎么用,因为他们觉得伪元素太诡异了.其实使用伪元素有很多好处,最大的好处是它可以简化页面的html标签,同时用起来也很方便,善于使用伪元素可以让你的页面更加地简洁优雅 ...

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

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

  10. 伪元素::after和::before

    ::after是一个CSS伪元素,使用::after,你可以从CSS里往页面上新增内容(不再要在HTML里有相应的东西).虽然最终生成的东西并不是真正的DOM里的内容,但这些内容能像普通内容一样显示, ...

随机推荐

  1. 定时自动备份mysql

    首先,利用定时shell脚本来实现 #!/bin/sh DATE=`date +%Y-%m-%d_%H:%M:%S` Pass='VHlrakBNeVNRTDNlZGMkUkZW' #加密解密密码,避 ...

  2. E. Third-Party Software - 2 贪心----最小区间覆盖

    E. Third-Party Software - 2 time limit per test 2.0 s memory limit per test 256 MB input standard in ...

  3. poj 1330 Nearest Common Ancestors 求最近祖先节点

    Nearest Common Ancestors Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 37386   Accept ...

  4. 第十四篇Django-model进阶(中介模型，查询优化，extra,整体插入)

    Django-model进阶(中介模型,查询优化,extra,整体插入) 阅读目录(Content) 中介模型 查询优化 extra 整体插入 中介模型 处理类似搭配 pizza 和 topping ...

  5. 2019山东ACM省赛L题题解（FLOYD传递闭包的变形）

    本题地址 https://cn.vjudge.net/contest/302014#problem/L Median Time Limit: 1 Second      Memory Limit: 6 ...

  6. ubuntu16.04 重置mysql密码

    先登陆服务器,找到自己的my.cnf文件,通常会在 /etc目录下(如果不在,可以用find / -name my.cnf命令找一下), 然后使用 vi my.cnf 命令编辑该文件(建议先备份),在 ...

  7. HDU 1576：A/B

    A/B Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total Submis ...

  8. Linux终端命令行的常用快捷键

    history 显示命令历史列表 ↑(Ctrl+p) 显示上一条命令 ↓(Ctrl+n) 显示下一条命令 !num 执行命令历史列表的第num条命令 !! 执行上一条命令 !?string? 执行含有 ...

  9. JVM探秘：jinfo查看JVM运行时参数

    本系列笔记主要基于<深入理解Java虚拟机:JVM高级特性与最佳实践 第2版>,是这本书的读书笔记. 如何查看JVM运行时参数,对于线上JVM调优是很关键的,因为只有知道了当前使用的JVM ...

  10. Codeforces 442A Borya and Hanabi

    有五种花色 外加 五种点数 共25张牌,每次有n张牌,主人知道这n张牌中有哪些牌,并且哪种牌有几张,但是不知道具体是哪张牌,他可以问某种花色,然后知道了哪几张是该花色,也可以问点数,然后就知道了哪几张 ...