尽管平淡如水，SVGg还是提供了几个技巧的。
<!DOCTYPE html> <svg width='1000' height='800' version='1.1' xmlns='http://www.w3.org/2000/svg'> <defs> <marker id="arrow" markerUnits="strokeWidth" markerWidth="12" markerHeight="12" viewBox="0 0 12 12" refX="6" refY="6" orient="auto"> <path d="M2,2 L10,6 L2,10 L6,6 L2,2" style="fill: black;" /> </marker> <filter id="GaussianBlur"> <feGaussianBlur in="SourceGraphic" stdDeviation="4" /> </filter> <linearGradient id="myGradient" x1="0%" y1="0%" x2="0%" y2="100%"> <stop offset="0%" stop-color="#F00" /> <stop offset="100%" stop-color="#0FF" /> </linearGradient> </defs> <line x1="0" y1="0" x2="200" y2="50" stroke="red" stroke-width="2" marker-end="url(#arrow)" /> <path d="M20,70 T80,100 T160,80 T200,90" fill="white" stroke="blue" stroke-width="2" marker-start="url(#arrow)" marker-mid="url(#arrow)" marker-end="url(#arrow)" /> <rect x="10" y="150" width="150" height="150" fill="blue" /> <rect x="180" y="150" width="150" height="150" fill="blue" filter="url(#GaussianBlur)" /> <rect fill="url(#myGradient)" x="10" y="310" width="330" height="100" /> </svg>
