How to make a couple of elements from the psd?

Good time of day.

Is the layout

How best to do this ribbed frame? 59d51284750b6278511799.jpeg

How to make an element with a transparent hole ?59d512d86fd0b427345898.jpeg
Comes to mind only as png-image. Are there any options without loading images from the server? Tried clip-path, but on the contrary, he leaves visible what is inside the selected area.
June 14th 19 at 20:00
1 answer
June 14th 19 at 20:02
Solution
Side can be made using :after with a background in the form of a triangle, and repeat-x(or svg)
And the effect of "holes" is like knockout you can search in google(it uses the background-clip and mix-blend-mode), but then I would have done using svg
thanks for the reply.
the background is a triangle, in the sense of a picture?
eventually made by using linear-gradient as taught here

and you can link to any tutorial on carving with the help of svg? examples are Google found, but there's a bunch of new tags and attributes, of course not understand :( - emmett.Lowe10 commented on June 14th 19 at 20:05
something I had in mind.
All tutorials will be with a bunch of new properties until You know about them. From css-tricks lucidly explained(sort of) - https://css-tricks.com/how-to-do-knockout-text/

Here have thrown as without the "hassle" cut button - https://jsfiddle.net/ar9vq433/1/ . One way of doing it) - sonia20 commented on June 14th 19 at 20:08
huge thanks - emmett.Lowe10 commented on June 14th 19 at 20:11

Find more questions by tags CSSHTML