Semantic UI es un marco de código abierto que utiliza CSS y jQuery para crear excelentes interfaces de usuario. Es lo mismo que un bootstrap para usar y tiene grandes elementos diferentes para usar para hacer que su sitio web se vea más increíble. En este artículo, vamos a aprender sobre la variación centrada en la publicidad.
Está equipado con componentes semánticos preconstruidos que ayudan a crear diseños receptivos utilizando HTML fácil de usar, y utiliza CSS y jQuery predefinidos para incorporar diferentes marcos.
Un anuncio muestra contenido promocional de terceros y puede aparecer centrado.
Clase de variación centrada en publicidad de interfaz de usuario semántica:
- centrado: este método se utiliza para hacer un espacio centrado para el anuncio.
Sintaxis:
<div class="ui centered banner test ad"></div>
El siguiente ejemplo ilustra la variación centrada en el anuncio de la interfaz de usuario semántica:
Ejemplo 1:
HTML
<!DOCTYPE html> <html> <head> <title>Semantic UI</title> <link href= "https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" rel="stylesheet" /> </head> <body> <center> <h1 class="ui header green">GeeksForGeeks</h1> <h2>Semantic UI Advertisement Centered Variation</h2> </center> <div class="ui centered banner test ad"></div> </body> </html>
Producción:
Ejemplo 2:
HTML
<!DOCTYPE html> <html> <head> <title>Semantic UI</title> <link href= "https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" rel="stylesheet" /> </head> <body> <center> <h1 class="ui header green">GeeksForGeeks</h1> <h2>Semantic UI Advertisement Centered Variation</h2> </center> <div class="ui centered banner test ad"></div> GeeksForGeeks is best place to learn DSA. <div class="ui centered banner test ad"></div> </body> </html>
Producción:
Variación centrada en la publicidad de interfaz de usuario semántica
Referencia: https://semantic-ui.com/views/advertisement.html#centered
Publicación traducida automáticamente
Artículo escrito por krishnanand3 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA