Differences

This shows you the differences between two versions of the page.

--- cecilia:webdesign:accordion [2022/02/10 11:03] – ceciliav
+++ cecilia:webdesign:accordion [2022/02/10 11:06] (current) – [HTML (galerij Intercolor)] ceciliav
@@ Line 34: / Line 34: @@
 <div class="galerij wrapper">
             <div class="foto">
-                <img src="monster-berken-mat-300x300.jpg" class="monster" title="interlaq transparant mat" alt="interlaq transparant mat" style="width:100%; height:100%">
+                <img src="foto1.jpg" class="monster" title="interlaq transparant mat" alt="interlaq transparant mat" style="width:100%; height:100%">
                 <div class="fototekst"><b>Interlaq</b> transparant mat. Berkenmultiplex met transparante laklaag.</div>
             </div>
             <div class="foto">
-                <img src="monster-berken-whitewash-300x300.jpg" class="monster" title="interlaq whitewash mat" alt="interlaq whitewash mat" style="width:100%; height:100%">
+                <img src="foto2.jpg" class="monster" title="interlaq whitewash mat" alt="interlaq whitewash mat" style="width:100%; height:100%">
                 <div class="fototekst"><b>Interlaq</b> whitewash mat. Berkenmultiplex met whitewash laklaag.</div>
             </div>
             <div class="foto">
-                <img src="monster-interform-zwart-300x300.jpg" class="monster" title="interform zwart" alt="interform zwart" style="width:100%; height:100%">
+                <img src="foto3.jpg" class="monster" title="interform zwart" alt="interform zwart" style="width:100%; height:100%">
                 <div class="fototekst"><b>Interform</b> zwart. Berkenmultiplex met zwarte semitransparante coating.</div>
             </div>
             <div class="foto">
-                <img src="monster-interform-groen-300x300.jpg" class="monster" title="interform groen" alt="interform groen" style="width:100%; height:100%">
+                <img src="foto4.jpg" class="monster" title="interform groen" alt="interform groen" style="width:100%; height:100%">
                 <div class="fototekst"><b>Interform</b> groen. Berkenmultiplex met groene semitransparante coating.</div>
             </div>
@@ Line 52: / Line 52: @@
     <div class="content">
                 <div class="foto">
-                    <img src="monster-interform-geel-300x300.jpg" class="monster" title="interform geel" alt="interform geel" style="width:100%; height:100%">
+                    <img src="foto5.jpg" class="monster" title="interform geel" alt="interform geel" style="width:100%; height:100%">
                     <div class="fototekst"><b>Interform</b> geel. Berkenmultiplex met gele semitransparante coating.</div>
                 </div>
                 <div class="foto">
-                    <img src="monster-interform-lichtbruin-300x300.jpg" class="monster" title="interform lichtbruin" alt="interform lichtbruin" style="width:100%; height:100%">
+                    <img src="foto6.jpg" class="monster" title="interform lichtbruin" alt="interform lichtbruin" style="width:100%; height:100%">
                     <div class="fototekst"><b>Interform</b> lichtbruin. Berkenmultiplex met lichtbruine semitransparante coating.</div>
                 </div>
                 <div class="foto">
-                    <img src="monster-interform-grijs-300x300.jpg" class="monster" title="interform grijs" alt="interform grijs" style="width:100%; height:100%">
+                    <img src="foto7.jpg" class="monster" title="interform grijs" alt="interform grijs" style="width:100%; height:100%">
                     <div class="fototekst"><b>Interform</b> grijs. Berkenmultiplex met grijze, dekkende coating.</div>
                 </div>
                 <div class="foto">
-                    <img src="monster-interform-300x300.jpg" class="monster" title="interform donkerbruin" alt="interform donkerbruin" style="width:100%; height:100%">
+                    <img src="foto8.jpg" class="monster" title="interform donkerbruin" alt="interform donkerbruin" style="width:100%; height:100%">
                     <div class="fototekst"><b>Interform</b> donkerbruin. Berkenmultiplex met donkerbruine semitransparante coating.</div>
                 </div>
                 <div class="foto">
-                    <img src="monster-interstar-glad-300x300.jpg" class="monster" title="interstar glad wit" alt="interstar glad wit" style="width:100%; height:100%">
+                    <img src="foto9.jpg" class="monster" title="interstar glad wit" alt="interstar glad wit" style="width:100%; height:100%">
                     <div class="fototekst"><b>Interstar</b> glad. Berkenmultiplex met gladde, witte melamine coating.</div>
                 </div>
                 <div class="foto">
-                    <img src="monster-interstar-wit-300x300.jpg" class="monster" title="interstar structuur wit" alt="interstar structuur wit" style="width:100%; height:100%">
+                    <img src="foto10.jpg" class="monster" title="interstar structuur wit" alt="interstar structuur wit" style="width:100%; height:100%">
                     <div class="fototekst"><b>Interstar</b> structuur wit. Berkenmultiplex met PPL-laag met lichte structuur.</div>
                 </div>
                 <div class="foto">
-                    <img src="monster-interstar-grijsbruin-300x300.jpg" class="monster" title="interstar structuur grijsbruin" alt="interstar structuur grijsbruin" style="width:100%; height:100%">
+                    <img src="foto11.jpg" class="monster" title="interstar structuur grijsbruin" alt="interstar structuur grijsbruin" style="width:100%; height:100%">
                     <div class="fototekst"><b>Interstar</b> structuur grijsbruin. Berkenmultiplex met PPL-laag met lichte structuur.</div>
                 </div>
                 <div class="foto">
-                    <img src="monster-interstar-zilver-300x300.jpg" class="monster" title="interstar structuur zilver" alt="interstar structuur zilver" style="width:100%; height:100%">
+                    <img src="foto12.jpg" class="monster" title="interstar structuur zilver" alt="interstar structuur zilver" style="width:100%; height:100%">
                     <div class="fototekst"><b>Interstar</b> structuur zilver. Berkenmultiplex met PPL-laag met lichte structuur.</div>
                 </div>
                 <div class="foto">
-                    <img src="monster-interstar-zwart-300x300.jpg" class="monster" title="interstar structuur zwart" alt="interstar structuur zwart" style="width:100%; height:100%">
+                    <img src="foto13.jpg" class="monster" title="interstar structuur zwart" alt="interstar structuur zwart" style="width:100%; height:100%">
                     <div class="fototekst"><b>Interstar</b> structuur zwart. Berkenmultiplex met PPL-laag met lichte structuur.</div>
                 </div>
@@ Line 93: / Line 93: @@
 ===== CSS =====
+<code>
     /* ------------ Meer producten zichtbaar via uitklappen bij kleinere beeldschermen -------------*/
     @media only screen and (max-width: 600px) {
@@ Line 142: / Line 143: @@
         }
     }
+</code>