Есть ли в JSS эквивалент цвета фона + изображения? - PullRequest
Новая
       152

Есть ли в JSS эквивалент цвета фона + изображения?

1 голос
/ 28 мая 2020

Я использую JSS в React для стилизации компонентов пользовательского интерфейса материала. Я попытался просмотреть в Интернете эквивалент приведенного ниже кода из CSS в JSS, но мне это не удалось. 

 background: 
    linear-gradient(
      rgba(64, 153, 255, 0.5), 
      rgba(64, 153, 255, 0.5)
    )    
    ,
   url('myUrl');

Может кто-нибудь помочь мне выяснить, есть ли способ достичь того же результат в JSS.

1 Ответ

0 голосов
/ 28 мая 2020

Ниже рабочий пример правильного синтаксиса. Все значение для фонового изображения (linear-gradient - это изображение, а не цвет) помещается в одну строку. 

import React from "react";
import { makeStyles } from "@material-ui/core/styles";

const useStyles = makeStyles({
  gradientAndUrl: {
    width: "400px",
    height: "400px",
    backgroundImage:
      "linear-gradient(rgba(64, 153, 255, 0.5), rgba(64, 153, 255, 0.5)), url(https://www.publicdomainpictures.net/pictures/10000/velka/black-monkey-11280155875i3QV.jpg)"
  }
});

export default function App() {
  const classes = useStyles();
  return <div className={classes.gradientAndUrl} />;
}

Edit Background image gradient and URL

Связанные ответ: Как добавить цвет линейного градиента к слайдеру?

...