1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
import React from "react";
export default function Card3() {
return (
<div className="Newcard">
<div>
<div
style={{
border: "2px solid black",
padding: 5,
borderRadius: "10px",
margin: 10,
backgroundColor: "#fff"
}}
>
<img
alt="project_img"
style={{ width: 300, height: 300 }}
src="https://images.unsplash.com/photo-1560169897-fc0cdbdfa4d5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1472&q=80"
/>
<h3>My TV Propject</h3>
<p>HTML, CSS, JavaScript</p>
<p>This is my first JS project.</p>
</div>
</div>
</div>
);
}
1 of 1
(property) StandardShorthandProperties<string | number, string & {}>.borderRadius?: Property.BorderRadius<string | number>
The border-radius CSS property rounds the corners of an element's outer border edge. You can set a single radius to make circular corners, or two radii to make elliptical corners.
Syntax: <length-percentage>{1,4} [ / <length-percentage>{1,4} ]?
| Chrome | +Firefox | +Safari | +Edge | +IE | +
|---|---|---|---|---|
| 4 | +4 | +5 | +12 | +9 | +
| 1 -x- | ++ | 3 -x- | ++ | + |
@see — https://developer.mozilla.org/docs/Web/CSS/border-radius