首页 > 其他分享 >transition-property属性改变元素背景色。

transition-property属性改变元素背景色。

时间:2023-06-17 18:00:50浏览次数:35  
标签:color transition 100px 背景色 background property 属性

未使用transition-property属性前

transition-property属性改变元素背景色。_css

使用transition-property属性后面

transition-property属性改变元素背景色。_背景颜色_02

代码如下:

<html

<!doctype html>
<html>
<head>

<meta charset="utf-8">

<title>transition-property属性</title>

<style type="text/css">//引用css文件
div{
	width:400px;//宽度为400px
	height:100px;//高度为100px
	background-color:red;/背景颜色为红色
	font-weight:bold;//字体加粗
	color:#FFF;

	}

div:hover{

	background-color:blue;

	/*指定动画过渡的CSS属性*/

	-webkit-transition-property:background-color;

	-moz-transition-property:background-color;

	-o-transition-property:background-color;

	}

</style>

</head>

<body>

<div>使用transition-property属性改变元素背景色</div>

</body>

</html>


标签:color,transition,100px,背景色,background,property,属性
From: https://blog.51cto.com/u_16164133/6505779

相关文章

  • mybatis 3.x 升级时遇到的keyProperty问题小坑
    背景:有1个项目,原来是用的mybatis3.4.6版本,其中有一些插入mapper是这样写的:IntegerinsertEntitySelectiveShard(@Param("tableSuffix")StringtableSuffix,@Param("entity")XXXEntityentity);对应的xml片段:<insertid="insertEntitySelectiveShard"par......
  • JavaScript之Object.defineProperty()
    1.对象的定义与赋值经常使用的定义与赋值方法obj.prop=value或者obj['prop']=valueletPerson={};Person.name="Jack";Person["gender"]="female";console.log(Person.name);//Jackconsole.log(Person.gender);//femaleconsole.log(Pers......
  • CSS 如何根据背景色自动切换黑白文字?
    在项目中,经常会碰到背景色不确定的场景,为了让内容文字足够清晰可见,文字和背景之间需要有足够的对比度。换句话说,当背景是深色时,文字为白色,当背景是浅色时,文字为黑色,就像这样:一、CSS滤镜实现使用滤镜对文字单独处理,所以需要额外一层标签。然后容器和文字用同一种颜色表示,目的是......
  • Dim MyPropBag As PropertyBag
    '缺省属性值:Constm_def_TimeFormat="hh-mm-ss"'属性变量:'Dimm_TimeFormatAsStringDimMyPropBagAsPropertyBag'注意!不要删除或修改下列被注释的行!'MappingInfo=Timer1,Timer1,-1,IntervalPublicPropertyGetInterval()AsLongInterval......
  • 2023-06-12 运行旧的rouyi前端项目报错:unknown property 'disableHostCheck'
    运行,报错ERRORValidationError:Invalidoptionsobject.DevServerhasbeeninitializedusinganoptionsobjectthatdoesnotmatchtheAPIschema.-optionshasanunknownproperty'disableHostCheck'.Thesepropertiesarevalid:......
  • 属性、property和属性描述符
    1、实例属性和类属性的区别在Python中,类属性是定义在类级别上的变量或常量,它们是所有该类实例共享的值。而实例属性是定义在实例级别上的变量或常量,每个实例都有其自己的值。 区别主要在于:值的存储位置:类属性存储在类的命名空间中,而实例属性存储在实例的命名空间中。访问方......
  • ChatGPT API Transition Guide
    ChatGPTAPITransitionGuideHowtogetstartedWrittenby JoshuaJ.. UpdatedoveraweekagoPromptstoMessagesTohaveamoreinteractiveanddynamicconversationwithourmodels,youcanusemessagesinChatGPTinsteadoftheoldprompt-styleusingwithc......
  • Python+matplotlib绘制背景色和坐标轴刻度变化的动态柱状图
    问题描述:已知某商品从2000年至2019年每年12个月的价格波动情况,要求绘制动态柱状图进行可视化,要求每年改变一次轴域背景色。参考代码:运行效果:公众号“Python小屋”......
  • prefers-color-scheme与color-scheme自由切换网站主题背景色变化
    部分转自:布依前端和前端侦探prefers-color-schemeprefers-color-scheme这个新的css特性,想必大家并不陌生,写文章的目的就是分享给大家怎么正确用好它以及提升网站用户体验。prefers-color-scheme是CSS 媒体特性【@media】用于检测用户是否有将操作系统的主题色设置为亮色【light】......
  • QT中的动画类(QPropertyAnimation)
    (文章目录)前言QPropertyAnimation是QT中的一个动画类,用于对目标对象的属性进行动画效果展示。该类继承自QAbstractAnimation类,使用起来非常方便和灵活。一、QPropertyAnimation类介绍QPropertyAnimation可以对任何QObject的子类的属性进行动画的展示,只要该属性是可写的,即存在......