<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>CSS3 SVG网格六边形图案特效 - 站长素材</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 800 600" >
<defs>
<pattern id="Hexagonos" x="0" y="0" width="55.3491" height="95.8675" patternUnits="userSpaceOnUse" patternTransform="yes">
<g class="Trazo">
<polyline points="12.6,-19.6 40.2,-3.6 67.9,-19.6 "/>
<polyline points="-15.1,28.4 12.6,44.4 40.2,28.4 67.9,44.4 "/>
<polyline points="-15.1,92.3 12.6,76.3 40.2,92.3 67.9,76.3 "/>
<line x1="12.6" y1="76.3" x2="12.6" y2="44.4"/>
<line x1="40.2" y1="92.3" x2="40.2" y2="124.2"/>
<line x1="40.2" y1="-3.6" x2="40.2" y2="28.4"/>
</g>
</pattern>
<rect id="Patron" fill="url(#Hexagonos)" width="1200" height="1000" x="-200" y="-200" opacity="0.60"/>
</defs>
<g class="Panal">
<use xlink:href="#Patron" class="haciaLas12"/>
<use xlink:href="#Patron" class="haciaLas4"/>
<use xlink:href="#Patron" class="haciaLas8"/>
</g>
</svg>
</body>
</html>