@supports使用方法

123 篇文章 0 订阅
18 篇文章 0 订阅

原文地址:https://justforuse.github.io/blog/zh-cn/2018/08/supports-tutorial/

@supports是CSS3新引入的规则之一,主要用于检测当前浏览器是否支持某个CSS属性并加载具体样式.

基本使用方式:

@supports (display: grid) {
    .container {
        color: red;
    }
}

 
 

类似@media媒体查询,当浏览器支持display:grid这个CSS属性时才应用其中的样式

所以上述代码比如在IE9下就不会显示为红色字体。

主要用在防止旧浏览器不支持某些属性造成排版混乱的情况,使用@supports当做备选项。

此外,还支持逻辑运算符;not, and, or

例如

@supports not(display: grid){...}
@supports (display: grid) and (position: sticky){...}
@supports (display: grid) or (display: flex){...}

 
 

括号内不一定都要是“关键字”,只要是CSS语法都可以,比如:

@supports (border-radius: 4px) or (--btn-color: red){...}

 
 

上面就表示支持border-radius或者css variables就会加载其中的样式

js中也可以调用类似的方法:

if(CSS.supports('display', 'grid')){
    alert('it support!')
}

 
 

当然,这个支持性IE下全跪
PDVuyn.png

个人觉得这其中有个很矛盾的地方,就是这个属性基本只有在“高级”浏览器下才会是生效,但“高级”浏览器的支持范围又支持大部分的CSS属性,所以觉得把他当做一个“低级”浏览器检测器倒是个不错的选择

参考链接:https://www.sitepoint.com/an-introduction-to-css-supports-rule-feature-queries/

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
@Transactional是Spring框架中用于管理事务的注解,可以作用于接口、类、类方法。具体使用方法如下: 1.作用于类:表示所有该类的public方法都配置相同的事务属性信息。 ```java @Transactional public class UserServiceImpl implements UserService { //... } ``` 2.作用于方法:表示该方法需要进行事务管理。 ```java @Transactional public void addUser(User user) { //... } ``` 3.指定事务的传播行为(propagation): ```java @Transactional(propagation = Propagation.REQUIRED) public void addUser(User user) { //... } ``` 常用的传播行为有: - REQUIRED:如果当前没有事务,就新建一个事务,如果已经存在一个事务中,加入到这个事务中。 - SUPPORTS:支持当前事务,如果当前没有事务,就以非事务方式执行。 - MANDATORY:使用当前的事务,如果当前没有事务,就抛出异常。 - REQUIRES_NEW:新建事务,如果当前存在事务,把当前事务挂起。 - NOT_SUPPORTED:以非事务方式执行操作,如果当前存在事务,就把当前事务挂起。 - NEVER:以非事务方式执行,如果当前存在事务,则抛出异常。 - NESTED:如果当前存在事务,则在嵌套事务内执行。如果当前没有事务,则执行与REQUIRED类似的操作。 4.指定事务的隔离级别(isolation): ```java @Transactional(isolation = Isolation.READ_COMMITTED) public void addUser(User user) { //... } ``` 常用的隔离级别有: - DEFAULT:使用数据库默认的隔离级别。 - READ_UNCOMMITTED:读取未提交的数据,可能会导致脏读、不可重复读、幻读等问题。 - READ_COMMITTED:读取已提交的数据,可以避免脏读问题,但是不可重复读和幻读问题仍然存在。 - REPEATABLE_READ:可重复读,可以避免脏读和不可重复读问题,但是幻读问题仍然存在。 - SERIALIZABLE:串行化,可以避免脏读、不可重复读和幻读问题,但是性能较差。 5.指定事务的超时时间(timeout): ```java @Transactional(timeout = 10) public void addUser(User user) { //... } ``` 超时时间单位为秒。 6.指定不回滚的异常类型(noRollbackFor): ```java @Transactional(noRollbackFor = {NullPointerException.class, IllegalArgumentException.class}) public void addUser(User user) { //... } ``` 指定的异常类型抛出时,不会回滚事务。 7.指定回滚的异常类型(rollbackFor): ```java @Transactional(rollbackFor = Exception.class) public void addUser(User user) { //... } ``` 指定的异常类型抛出时,会回滚事务。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值