综合教程

微信小程序界面设计-小程序中的WXSS(css)选择器在线视频教程-伪元素选择器-::first-line伪元素

时间:2019/1/16 13:05:42  作者:互联网  来源:网络转载  查看:54771  评论:0
内容摘要:伪元素选择器-::first-line伪元素通用语法定义和用法:first-line 选择器用于选取指定选择器的首行。注释:以下属性可与 :first-line 使用: 字体属性 颜色属性 背景属性 word-spa...
伪元素选择器-::first-line伪元素

通用语法

定义和用法

:first-line 选择器用于选取指定选择器的首行。

注释:以下属性可与 :first-line 使用:

 字体属性
 颜色属性
 背景属性
 word-spacing
 letter-spacing
 text-decoration
 vertical-align
 text-transform
 line-height
 clear

浏览器支持


微信小程序界面设计-小程序中的WXSS(css)选择器在线视频教程-伪元素选择器-::first-line伪元素
所有主流浏览器都支持 :first-line 选择器。

实例

选择每个 <p> 元素的首行,并为其设置样式:

<!DOCTYPE html>

<html>

<head>

<style>

p:first-line

{

background-color:yellow;

}

</style>

</head>

 

<body>

<h1>WWF's Mission Statement</h1>

<p>To stop the degradation of the planet's natural environment and to build a future in which humans live in harmony with nature, by; conserving the world's biological diversity, ensuring that the use of renewable natural resources is sustainable, and promoting the reduction of pollution and wasteful consumption.</p>

</body>

</html>

效果图

微信小程序界面设计-小程序中的WXSS(css)选择器在线视频教程-伪元素选择器-::first-line伪元素



小程序应用

Wxml代码

<view>

  To stop the degradation of the planet's natural environment and to build a future in which humans live in harmony with nature

</view>

 

<view>

  黄菊华老师,浙江杭州余杭区,在平台查询老师名字就可以查询到老师的课程!

</view>

 

<text>

  To stop the degradation of the planet's natural environment and to build a future in which humans live in harmony with nature

</text>

 

<view>

  <text>

  黄菊华老师,浙江杭州余杭区,在平台查询老师名字就可以查询到老师的课程!

  </text>

</view>

Wxss代码

view::first-line{

  color:red;

}

 

text::first-line

{

  color: green;

}

效果图

微信小程序界面设计-小程序中的WXSS(css)选择器在线视频教程-伪元素选择器-::first-line伪元素

欢迎大家收看我的视频课程:微信小程序界面设计-小程序中的WXSS(css)选择器
微信小程序界面设计-小程序中的WXSS(css)选择器在线视频教程-伪元素选择器-::selection伪元素



相关评论
评论者:      验证码:  点击获取验证码
咨询QQ/微信:45157718 点击这里给我发消息 | 电话:13516821613 | 浙江杭州余杭区东港路118号雷恩科技创新园 | 网站支持:杭州摇亿网络科技 | 浙ICP备06056032号-6 |