<!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. 151-PHP nl2br函数（二）

    <?php $str="h\nt\nm\nl"; //定义一个多处换行的字串 echo "未处理前的输出形式:<br />{$str}"; $ ...

  2. webapi------宿主程序

    业务场景: 公司的容器程序需要给前端暴露接口但是代码里面又不想写webapi项目工程就用到了宿主可以达到webapi的效果 1.owin实现 2.其他实现 测试实现如下 1.新建一个控制台程序 2.新 ...

  3. 第八篇Django分页

    Django分页 1.复杂版 data = [] , ): tmp = {"id": i, "name": "alex-{}".format ...

  4. P1018 锤子剪刀布

    转跳点:

  5. 不得了的try catch

    try catch:几乎所有语言都有这个语句 try { //可能会导致错误的代码 } catch (error) { //在错误发生时怎么处理 }finally { //即使报错始终执行 } 1. ...

  6. PHP的操作符与控制结构

    一．操作符  操作符是用来对数组和变量进行某种操作运算的符号. 算术操作符 操作符 名称 示例 + 加 $a+$b - 减 $a-$b * 乘 $a*$b / 除 $a/$b % 取余 $a%$b 复 ...

  7. BZOJ：2244: [SDOI2011]拦截导弹

    问题: printf("%.5f ",0):为什么错了? 注意: 初始值很重要 题解: 三维偏序问题: 记录从前往后最长上升子序列长度pref,条数preg 从后往前suff,su ...

  8. 【STM32H7教程】第48章 STM32H7的FMC总线应用之是32路高速IO扩展

    完整教程下载地址:http://www.armbbs.cn/forum.php?mod=viewthread&tid=86980 第48章       STM32H7的FMC总线应用之是32路 ...

  9. 四个因素决定Essay写作段落长度

    段落是一篇Essay的基石,写好Essay应从写好段落开始.那么Essay写作中一个段落多长为好?英语和修辞学教授理查德·诺德奎斯特著文介绍了一些专家的观点.从以下的译文可以看到,段落长度虽然没有固定 ...

  10. Nginx系列p3：实现一个具有缓存功能的反向代理服务器

    今天我们利用 OpenResty 来实现一个反向代理服务器 step1:首先下载安装 OpenResty # 下载安装 OpenResty # 默认安装在 /usr/local 目录下,可在编译时指定 ...