StaffManipulation

by Nate

HTML

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.0" width="240" height="25">
  <line id="f-line" class="staff-line" x2="240" y2="0.5" x1="0" y1="0.5" style="stroke:#000000"/>
  <line id="d-line" class="staff-line" x2="240" y2="6.5" x1="0" y1="6.5" style="stroke:#000000"/>
  <line id="b-line" class="staff-line" x2="240" y2="12.5" x1="0" y1="12.5" style="stroke:#000000"/>
  <line id="g-line" class="staff-line" x2="240" y2="18.5" x1="0" y1="18.5" style="stroke:#000000"/>
  <line id="e-line" class="staff-line" x2="240" y2="24.5" x1="0" y1="24.5" style="stroke:#000000"/>
</svg>

CSS

.staff-line:hover {
  stroke-width: 2;
}