Consulte también Plantilla: recorte de imagen CSS fácil , que simplifica un poco la interfaz de esta plantilla.
{{ CSS image crop }} crea un recorte de una imagen en línea para obtener una vista previa de la apariencia de una página, o para vincular imágenes completas cuando se prefiere un ligero recorte en un artículo, pero la imagen completa es más enciclopédica en general. Cuando solo se utiliza una pequeña sección de la imagen después del recorte, es mejor cargar el recorte como un archivo nuevo para evitar enviar datos de imagen adicionales a los usuarios.
Nota: Hubo un problema técnico anterior por el cual algunas personas tuvieron que usar "tleft", "tright", etc. como solución alternativa porque "left" y "right" no funcionaban. Como resultado, para evitar tener que arreglar todas las páginas que utilizaron la solución alternativa, la plantilla ha sido diseñada para funcionar correctamente independientemente de si se utiliza tright o right. Consulte la plantilla de charla para obtener más detalles.
.svg/1280px-Test_Template_Info-Icon_-_Version_(2).svg.png){kind=icon}
{{ Recorte de imagen CSS | Imagen = El nombre del archivo de imagen, o puede aceptar {{ Imagen anotada }} . | bSize = El ancho de la imagen base en píxeles (la imagen que estamos recortando) | cWidth = Ancho de imagen recortada en píxeles | cHeight = Recortar altura de la imagen en píxeles | oTop = Desplazamiento superior en píxeles, opcional y el valor predeterminado es 0 cuando se omite | oLeft = Desplazamiento izquierdo en píxeles, opcional y el valor predeterminado es 0 cuando se omite | Ubicación = 'derecha', 'izquierda', 'centro' o 'ninguna'. Determina la ubicación de la imagen en la página. El valor predeterminado es "derecha" cuando se proporciona una descripción (como es el valor predeterminado para las imágenes en miniatura) Cuando la descripción está en blanco, la ubicación está a la izquierda (como es el valor predeterminado para los que no son pulgares)| Descripción = Descripción (se representará usando la clase de miniatura) | Enlace = Nombre de un artículo que se vinculará haciendo clic en la imagen (omitir a menos que haya un buena razón para vincular a un artículo en lugar de a la imagen).| Alt = El texto alternativo de la imagen. | Página = La página del archivo, si hay varias páginas (como archivos pdf). | magnify-link = La imagen que se vinculará mediante el icono de ampliación (úselo si el parámetro Imagen está configurado en {{ Imagen anotada }} o el parámetro Enlace conduce a algo distinto a la imagen). }}Crea una imagen recortada de una sola gota de agua:
oTopy oLeftdefine la esquina superior izquierda de la imagen recortada.cWidthy cHeightdefinir el tamaño de la imagen recortada.bSize{{ Recorte de imagen CSS | Imagen = Rocío sobre la hierba Luc Viatour.jpg | bTamaño = 400 | cAncho = 100 | cAltura = 100 | oArriba = 180 | oIzquierda = 60 }}Además, la imagen recortada puede tener un título de texto y ubicarse en la página:
Location=a la posición ( centro, derecha, izquierda, ninguno )Description=para agregar un texto al título{{ Recorte de imagen CSS | Imagen = Rocío sobre la hierba Luc Viatour.jpg | bTamaño = 400 | cAncho = 100 | cAltura = 100 | oArriba = 180 | oIzquierda = 60 | Ubicación = centro | Descripción = Una gota de rocío sobre la hierba (enfoque en la gota) }}Se pueden organizar grupos de imágenes recortadas en un marco de imagen :
.jpg/1280px-Aaron_Burden_2017-05-03_(Unsplash).jpg)
{{ Marco de imagen | alinear = centrar | borde = no | caption = Imágenes recortadas en un marco | contenido = {{ pila |{{ recorte de imagen CSS | Imagen = Aaron_Burden_2017-05-03_(Unsplash).jpg | bTamaño = 400 | cAncho = 100 | cAltura = 100 | oArriba = 180 | oIzquierda = 60 }} |{{ Recorte de imagen CSS | Imagen = Rocío sobre hierba de limón - Jardines Shola - Kotagiri.jpg | bTamaño = 400 | cAncho = 100 | cAltura = 100 | oArriba = 180 | oIzquierda = 60 }} }} {{ pila |{{ Recorte de imagen CSS | Imagen = Rocío sobre la hierba Luc Viatour.jpg | bTamaño = 400 | cAncho = 100 | cAltura = 100 | oArriba = 180 | oIzquierda = 60 }} |{{ Recorte de imagen CSS | Imagen = Rocío y hierba - Flickr - Stiller Beobachter.jpg | bTamaño = 400 | cAncho = 100 | cAltura = 100 | oArriba = 180 | oIzquierda = 60 }} }} }}El script de usuario Usuario:BrandonXLF/CSSImageCrop se puede utilizar para generar código para usar esta plantilla con una interfaz de usuario interactiva.