CSS3标明引入的出处和来源于的方式

日期:2021-01-20 类型:科技新闻 

关键词:公众号小程序,小程序正规价格表,微信群签到小程序,网络抽签小程序,个人做小程序需要什么

疫情呆家里都快发霉了,开启电脑上动动人的大脑,今日给大伙儿共享1篇有关CSS3标明引入的出处和来源于的方式。

新技术应用的出現常常代表着新的生产制造力的提升。伴随着HTML5和CSS3的时兴和普及,愈来愈多的新方式能让大家简约又轻轻松松的处理之前用很繁杂的编码才可以进行的事儿。例如HTML5中的download和placeholder,CSS3中的测算器和计数器,都使大家Web开发设计人员的工作中量大大减少,由于这些作用的出現使大家省去了许多气力。这里,我将给大伙儿详细介绍1个应用CSS3中的content和attr技术性恰当标明语录的作者或前言的出处的方式。

  假如在文章内容中引入他人的话,或引入了某本书里的某段文章内容,应当将人名或书名在引入后标明出来,这不仅是出于礼貌,也属于出于重视。一般大家的做法是应用float:right,让出处在前言的右下角出現。但CSS3中的content和attr技术性让大家能更恰当的完成它。下面是CSS3完成的实际效果图。

   HTML编码

  却说3藏着妖精送出洞外,沙僧人近前问曰:“师父出来,师兄在哪?”

  8戒道:“他有耍心眼,必然贴换师父出来也。”3藏用手指着妖精道:“

  你师兄在他肚里哩。”8戒笑道:“腌脏杀人!在肚里做甚?出来罢!”

  行者在里面叫道:“伸开口,等我出来!”那怪整个把口伸开。行者变

  得小小的的,瑀在咽喉以内,正欲出来,又恐他无理来咬,将要铁棒取下

  ,吹口仙气,叫:“变!”

  大伙儿留意到blockquote元素上的cite特性。大家沒有应用独立的元向来显示信息出处,而是运用了blockquote本身的特性。这样英语的语法上更清楚简易,词义上更成心义。

  CSS编码

  下面大家必须应用1小段CSS让cite特性里的內容显示信息到适合的地区,这就必须用到CSS3中的content和attr:  

blockquote[cite]:after { 
 
  background-color: #666666; 
 
  border: 1px solid #000000; 
 
  color: #EEEEEE; 
 
  content: attr(cite); 
   display: block; 
   font-size: smaller; 
   font-style: normal; 
   padding: 0 0.2em; 
     position: absolute; 
   right: 0.5em; 
   } 

  大家具体上应用了:after伪元向来显示信息出处信息内容。沒有提升附加的网页页面元素。应用肯定精准定位,将其精准定位到右下角,并且也有1定的层级感主要表现出来。十分的好看。

  假如并不是规定非常高,这类显示信息引入的出处或来源于的方式十分的合理。但也是有不好用的地区,例如你必须在出版书籍上加连接。这类用法在当代访问器里都适用,包含火狐、谷歌访问、iPhone访问器,IE9是彻底适用这类方式的。

总结

到此这篇有关CSS3标明引入的出处和来源于的恰当方式的文章内容就详细介绍到这了,更多有关css3 标明出处和来源于內容请检索脚本制作之家之前的文章内容或再次访问下面的有关文章内容,期待大伙儿之后多多适用脚本制作之家!