Saltearse al contenido

Tarjetas de enlace

Para mostrar enlaces a diferentes páginas de forma destacada, utiliza el componente <LinkCard>.

Preview

Importación

import { LinkCard } from '@astrojs/starlight/components';

Uso

Mostrar un enlace de forma destacada utilizando el componente <LinkCard>. Cada <LinkCard> requiere un atributo title y un atributo href.

import { LinkCard } from '@astrojs/starlight/components';
<LinkCard
title="Creación de contenido en Markdown"
href="/es/guides/authoring-content/"
/>

Agregar una descripción de enlace

Agrega una descripción breve a una tarjeta de enlace utilizando el atributo description.

import { LinkCard } from '@astrojs/starlight/components';
<LinkCard
title="Internacionalización"
href="/es/guides/i18n/"
description="Configura Starlight para admitir varios idiomas."
/>
Preview

Agrupar tarjetas de enlace

Muestra varias tarjetas de enlace una al lado de la otra cuando hay suficiente espacio agrupándolas con el componente <CardGrid>. Ve la guía “Agrupar tarjetas de enlace” para un ejemplo.

Props de <LinkCard>

Implementación: LinkCard.astro

El componente <LinkCard> acepta las siguientes propiedades, así como todos los demás atributos de los elementos <a>:

title

requerido
tipo: string

El título de la tarjeta de enlace a mostrar.

href

requerido
tipo: string

El URL al que enlazar cuando se interactúa con la tarjeta.

description

tipo: string

Una descripción opcional para mostrar debajo del título.