Cómo hacer esquinas afiladas en css3

El método de css3 para hacer esquinas afiladas: primero cree un archivo de muestra HTML; luego determine la posición de la esquina afilada; finalmente establezca el atributo en el div especificado como "top: 6px; left: -3px; border-top: 0px; border-bottom ... "para lograr el efecto de esquina nítida.



El entorno operativo de este tutorial: sistema windows7, versión css3, este método es aplicable a todas las computadoras de la marca.

Recomendación: "video tutorial CSS" con

esquinas afiladas en la parte superior.

Representación:



Código:


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

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51











 


 








 





 




Las esquinas afiladas están debajo.

Diagrama de efectos:



Código:


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

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51











 


 








 





 




La esquina pronunciada está a la izquierda.

Imagen del efecto:



Código:


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

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51











 


 








 





 




La esquina pronunciada está a la derecha.

Imagen del efecto:



Código:


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

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51











 


 








 





 

Supongo que te gusta

Origin blog.csdn.net/hdl17822307857/article/details/112557827
Recomendado
Clasificación