En este artículo, aprenderemos cómo crear un borde oculto usando las propiedades CSS.
En los siguientes ejemplos, tanto el estilo en línea como la definición de estilo se utilizan en la sección del encabezado para definir el borde oculto.
Acercarse:
- Usaremos dos encabezados en los que uno mostrará el color del borde y el otro no porque estará oculto usando CSS.
- El CSS que usaremos está dentro de las etiquetas también conocido como CSS en línea .
- La propiedad utilizada será border – style : hidden .
Ejemplo 1:
HTML
<!DOCTYPE html> <html> <head> <title>Hidden border</title> </head> <body> <h1 style="border-color:red ; border-style:hidden ;"> GFG Is best for Interview Preparation And Much More</h1> <h1 style="border-color:red ; border-style:solid ;"> GFG Is best for Interview Preparation And Much More</h1> </body> </html>
Producción:
borde oculto
Enfoque 2:
- Usaremos dos encabezados en los que uno mostrará el color del borde y el otro no porque estará oculto usando CSS.
- El CSS que usaremos está dentro de la etiqueta de estilo , también conocida como CSS interno , que se aplica en elementos como h1, h2 .
- La propiedad que usaremos border-style: hidden.
Ejemplo:
HTML
<!DOCTYPE html>
<html>
<head>
<style>
h1{
border-color : orange ;
border-style : hidden ;
}
h2{
border-color : orange;
border-style : solid;
}
</style>
<title>Hidden border</title>
</head>
<body>
<h1>GFG Is best for Interview Preparation And Much More</h1>
<h2>GFG Is best for Interview Preparation And Much More</h2>
</body>
</html>
Producción:
borde oculto con CSS interno
Publicación traducida automáticamente
Artículo escrito por agrajat112 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA