Skip to main content
Fim da Recompensa com 50 pontos de reputação concedidos por Wallace Vizerra
adicionou 90 caracteres ao conteúdo
Fonte Link
Alicia Tairini
  • 1,4mil
  • 1
  • 12
  • 27

CLIP significa RECORTAR, ou seja , ela recorta o conteúdo de um box.

  • A sintaxe é:

.container {clip: rect (top, right, bottom, left);}

onde:

container é o elemento HTML cujo conteúdo será recortado;

clip é a propriedade recortar;

rect(top , right , bottom , left) é a função para recortar cujos parâmetros são as coordenadas para o recorte expressas em medidas CSS .

Imagine que precise cortar a área destacada na figura a seguir com suas respectivas coordenadas:

inserir a descrição da imagem aqui

Nesse caso o código CSS ficaria assim:

.container {clip: rect (40px, 150px, 260px, 80px);

.container {clip: rect (40px, 150px, 260px, 80px);
  • Onde rect é os parâmetros para o recorte da imagem.

O resultado do recorte dessa imagem é:

inserir a descrição da imagem aqui

  • Perceba que a área da imagem que foi recortada permanece com seu espaço em branco no documento.

Obs: A propriedade clip só funciona para elementos posicionados de maneira fixed ou absolute. Lembrando que na documentação da mdn tem a seguinte afirmação.

Este recurso foi removido dos padrões da Web. Embora alguns navegadores ainda possam apoiá-lo, ele está em processo de queda. Evite usá-lo e atualizar o código existente, se possível; Consulte a tabela de compatibilidade na parte inferior desta página para orientar sua decisão. Esteja ciente de que esse recurso pode deixar de funcionar a qualquer momento.

Use clip-path em vez disso!

Referencia:

CLIP significa RECORTAR, ou seja , ela recorta o conteúdo de um box.

  • A sintaxe é:

.container {clip: rect (top, right, bottom, left);}

onde:

container é o elemento HTML cujo conteúdo será recortado;

clip é a propriedade recortar;

rect(top , right , bottom , left) é a função para recortar cujos parâmetros são as coordenadas para o recorte expressas em medidas CSS .

Imagine que precise cortar a área destacada na figura a seguir com suas respectivas coordenadas:

inserir a descrição da imagem aqui

Nesse caso o código CSS ficaria assim:

.container {clip: rect (40px, 150px, 260px, 80px);

  • Onde rect é os parâmetros para o recorte da imagem.

O resultado do recorte dessa imagem é:

inserir a descrição da imagem aqui

  • Perceba que a área da imagem que foi recortada permanece com seu espaço em branco no documento.

Obs: A propriedade clip só funciona para elementos posicionados de maneira fixed ou absolute. Lembrando que na documentação da mdn tem a seguinte afirmação.

Este recurso foi removido dos padrões da Web. Embora alguns navegadores ainda possam apoiá-lo, ele está em processo de queda. Evite usá-lo e atualizar o código existente, se possível; Consulte a tabela de compatibilidade na parte inferior desta página para orientar sua decisão. Esteja ciente de que esse recurso pode deixar de funcionar a qualquer momento.

Use clip-path em vez disso!

CLIP significa RECORTAR, ou seja , ela recorta o conteúdo de um box.

  • A sintaxe é:

.container {clip: rect (top, right, bottom, left);}

onde:

container é o elemento HTML cujo conteúdo será recortado;

clip é a propriedade recortar;

rect(top , right , bottom , left) é a função para recortar cujos parâmetros são as coordenadas para o recorte expressas em medidas CSS .

Imagine que precise cortar a área destacada na figura a seguir com suas respectivas coordenadas:

inserir a descrição da imagem aqui

Nesse caso o código CSS ficaria assim:

.container {clip: rect (40px, 150px, 260px, 80px);
  • Onde rect é os parâmetros para o recorte da imagem.

O resultado do recorte dessa imagem é:

inserir a descrição da imagem aqui

  • Perceba que a área da imagem que foi recortada permanece com seu espaço em branco no documento.

Obs: A propriedade clip só funciona para elementos posicionados de maneira fixed ou absolute. Lembrando que na documentação da mdn tem a seguinte afirmação.

Este recurso foi removido dos padrões da Web. Embora alguns navegadores ainda possam apoiá-lo, ele está em processo de queda. Evite usá-lo e atualizar o código existente, se possível; Consulte a tabela de compatibilidade na parte inferior desta página para orientar sua decisão. Esteja ciente de que esse recurso pode deixar de funcionar a qualquer momento.

Use clip-path em vez disso!

Referencia:

adicionou 698 caracteres ao conteúdo
Fonte Link
Marconi
  • 18mil
  • 20
  • 69
  • 132

CLIP significa RECORTAR, ou seja , ela recorta o conteúdo de um box.

  • A sintaxe é:

.container {clip: rect (top, right, bottom, left);}

onde:

container é o elemento HTML cujo conteúdo será recortado;

clip é a propriedade recortar;

rect(top , right , bottom , left) é a função para recortar cujos parâmetros são as coordenadas para o recorte expressas em medidas CSS .

Imagine que precise cortar a área destacada na figura a seguir com suas respectivas coordenadas:

inserir a descrição da imagem aqui

Nesse caso o código CSS ficaria assim:

.container {clip: rect (40px, 150px, 260px, 80px);

  • Onde rect é os parâmetros para o recorte da imagem.

O resultado do recorte dessa imagem é:

inserir a descrição da imagem aqui

  • Perceba que a área da imagem que foi recortada permanece com seu espaço em branco no documento.

Obs: A propriedade clip só funciona para elementos posicionados de maneira fixed ou absolute. Lembrando que na documentação da mdn tem a seguinte afirmação.

Este recurso foi removido dos padrões da Web. Embora alguns navegadores ainda possam apoiá-lo, ele está em processo de queda. Evite usá-lo e atualizar o código existente, se possível; Consulte a tabela de compatibilidade na parte inferior desta página para orientar sua decisão. Esteja ciente de que esse recurso pode deixar de funcionar a qualquer momento.

Use clip-path em vez disso!

CLIP significa RECORTAR, ou seja , ela recorta o conteúdo de um box.

  • A sintaxe é:

.container {clip: rect (top, right, bottom, left);}

onde:

container é o elemento HTML cujo conteúdo será recortado;

clip é a propriedade recortar;

rect(top , right , bottom , left) é a função para recortar cujos parâmetros são as coordenadas para o recorte expressas em medidas CSS .

Imagine que precise cortar a área destacada na figura a seguir com suas respectivas coordenadas:

inserir a descrição da imagem aqui

Nesse caso o código CSS ficaria assim:

.container {clip: rect (40px, 150px, 260px, 80px);

  • Onde rect é os parâmetros para o recorte da imagem.

O resultado do recorte dessa imagem é:

inserir a descrição da imagem aqui

  • Perceba que a área da imagem que foi recortada permanece com seu espaço em branco no documento.

Obs: A propriedade clip só funciona para elementos posicionados de maneira fixed ou absolute.

CLIP significa RECORTAR, ou seja , ela recorta o conteúdo de um box.

  • A sintaxe é:

.container {clip: rect (top, right, bottom, left);}

onde:

container é o elemento HTML cujo conteúdo será recortado;

clip é a propriedade recortar;

rect(top , right , bottom , left) é a função para recortar cujos parâmetros são as coordenadas para o recorte expressas em medidas CSS .

Imagine que precise cortar a área destacada na figura a seguir com suas respectivas coordenadas:

inserir a descrição da imagem aqui

Nesse caso o código CSS ficaria assim:

.container {clip: rect (40px, 150px, 260px, 80px);

  • Onde rect é os parâmetros para o recorte da imagem.

O resultado do recorte dessa imagem é:

inserir a descrição da imagem aqui

  • Perceba que a área da imagem que foi recortada permanece com seu espaço em branco no documento.

Obs: A propriedade clip só funciona para elementos posicionados de maneira fixed ou absolute. Lembrando que na documentação da mdn tem a seguinte afirmação.

Este recurso foi removido dos padrões da Web. Embora alguns navegadores ainda possam apoiá-lo, ele está em processo de queda. Evite usá-lo e atualizar o código existente, se possível; Consulte a tabela de compatibilidade na parte inferior desta página para orientar sua decisão. Esteja ciente de que esse recurso pode deixar de funcionar a qualquer momento.

Use clip-path em vez disso!

removeu 4 caracteres do conteúdo
Fonte Link
Alicia Tairini
  • 1,4mil
  • 1
  • 12
  • 27

CLIP significa RECORTAR, ou seja , ela recorta o conteúdo de um box.

  • A sintaxe é:

    .container {clip: rect (top, right, bottom, left);}

    A sintaxe é:

.container {clip: rect (top, right, bottom, left);}

onde:

container é o elemento HTML cujo conteúdo será recortado;

clip é a propriedade recortar;

rect(top , right , bottom , left) é a função para recortar cujos parâmetros são as coordenadas para o recorte expressas em medidas CSS .

Imagine que precise cortar a área destacada na figura a seguir com suas respectivas coordenadas:

inserir a descrição da imagem aqui

Nesse caso o código CSS ficaria assim:

.container {clip: rect (40px, 150px, 260px, 80px);

  • Onde rect é os parâmetros para o recorte da imagem.

O resultado do recorte dessa imagem é:

inserir a descrição da imagem aqui

  • Perceba que a área da imagem que foi recortada permanece com seu espaço em branco no documento.

Obs: A propriedade clip só funciona para elementos posicionados de maneira fixed ou absolute.

CLIP significa RECORTAR, ou seja , ela recorta o conteúdo de um box.

  • A sintaxe é:

    .container {clip: rect (top, right, bottom, left);}

onde:

container é o elemento HTML cujo conteúdo será recortado;

clip é a propriedade recortar;

rect(top , right , bottom , left) é a função para recortar cujos parâmetros são as coordenadas para o recorte expressas em medidas CSS .

Imagine que precise cortar a área destacada na figura a seguir com suas respectivas coordenadas:

inserir a descrição da imagem aqui

Nesse caso o código CSS ficaria assim:

.container {clip: rect (40px, 150px, 260px, 80px);

  • Onde rect é os parâmetros para o recorte da imagem.

O resultado do recorte dessa imagem é:

inserir a descrição da imagem aqui

  • Perceba que a área da imagem que foi recortada permanece com seu espaço em branco no documento.

Obs: A propriedade clip só funciona para elementos posicionados de maneira fixed ou absolute.

CLIP significa RECORTAR, ou seja , ela recorta o conteúdo de um box.

  • A sintaxe é:

.container {clip: rect (top, right, bottom, left);}

onde:

container é o elemento HTML cujo conteúdo será recortado;

clip é a propriedade recortar;

rect(top , right , bottom , left) é a função para recortar cujos parâmetros são as coordenadas para o recorte expressas em medidas CSS .

Imagine que precise cortar a área destacada na figura a seguir com suas respectivas coordenadas:

inserir a descrição da imagem aqui

Nesse caso o código CSS ficaria assim:

.container {clip: rect (40px, 150px, 260px, 80px);

  • Onde rect é os parâmetros para o recorte da imagem.

O resultado do recorte dessa imagem é:

inserir a descrição da imagem aqui

  • Perceba que a área da imagem que foi recortada permanece com seu espaço em branco no documento.

Obs: A propriedade clip só funciona para elementos posicionados de maneira fixed ou absolute.

Fonte Link
Alicia Tairini
  • 1,4mil
  • 1
  • 12
  • 27
Carregando