Heim  >  Artikel  >  Web-Frontend  >  Drei Möglichkeiten, Screenshots mit CSS zu erstellen

Drei Möglichkeiten, Screenshots mit CSS zu erstellen

零到壹度
零到壹度Original
2018-03-19 11:29:544312Durchsuche

Dieser Artikel teilt Ihnen hauptsächlich drei Methoden für CSS-Screenshots mit. Er hat einen guten Referenzwert und ich hoffe, dass er für alle hilfreich sein wird. Folgen wir dem Herausgeber und schauen wir uns das an. Ich hoffe, es kann allen helfen.

Mehrere Möglichkeiten, Bilder mit CSS zu scannen

Originalbild:
Drei Möglichkeiten, Screenshots mit CSS zu erstellen

  • DIV Hintergrundposition verwenden:

  • IMG Clip verwenden: rect (oben links Y, unten rechts
<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>


Drei Möglichkeiten, Screenshots mit CSS zu erstellenDIV+IMG Rand- und Überlaufattribute verwenden für Steuerung

  • Rendering:
  <img  class="img1" src="img/bk_title_all.jpg" / alt="Drei Möglichkeiten, Screenshots mit CSS zu erstellen" >
      <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


                                           

Das obige ist der detaillierte Inhalt vonDrei Möglichkeiten, Screenshots mit CSS zu erstellen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn