Trois façons de prendre des captures d'écran avec CSS

Cet article partage principalement avec vous trois méthodes de captures d'écran CSS. Il a une bonne valeur de référence et j'espère qu'il sera utile à tout le monde. Suivons l'éditeur pour y jeter un œil, j'espère que cela pourra aider tout le monde.

Plusieurs façons de capturer des images avec CSS

Image originale :

• DIV Utiliser background-position :

IMG Utiliser clip : rect (en haut à gauche Y, en bas à droite

<p class="p_bg"></p>
<style type="text/css">
   .p_bg
        {           
         width: 550px;     
         height: 113px;     
         background-image: url(img/bk_title_all.jpg);  
         background-repeat: no-repeat;       
         background-position: 0px -599px;  
}</style>

DIV+IMG Utiliser les attributs margin et overflow pour contrôle

• Rendu :

  <img  class="img1" src="img/bk_title_all.jpg" / alt="Trois façons de prendre des captures d'écran avec CSS" >
      <style type="text/css">
        .img1
        {  
            width: 550px;   
            background-image: url(img/bk_title_all.jpg);      
            clip: rect(599px 550px 712px 0px);      
            position: absolute;       
            margin-top: -599px;        }
       </style

                                            

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!