Skip to main content

Image Link

For use on external apps, this component requires an additional stylesheet

<link rel="stylesheet" type="text/css" href="https://ashlar.blob.core.windows.net/ashlar-theme-files/css/components/image-link.css" />
Prospective Students
leaves in water placeholder
<div class="wwu-image-link"> 
  <div class="image-link">
    <a href="#">Prospective Students</a>
    
    <div class="image image--stylized">
      <div class="field__item">
        <img src={Placeholder} alt="leaves in water placeholder"/>
      </div>
    </div>
  </div>
</div>

Alternate Styles​

Prospective Students
leaves in water placeholder
Prospective Students
leaves in water placeholder
Prospective Students
leaves in water placeholder
Prospective Students
leaves in water placeholder
<div class="wwu-image-link green"> 
  <div class="image-link">
    <a href="#">Prospective Students</a>
    
    <div class="image image--stylized">
      <div class="field__item">
        <img src={Placeholder} alt="leaves in water placeholder"/>
      </div>
    </div>
  </div>
</div>

<div class="wwu-image-link simple"> 
  <div class="image-link">
    <a href="#">Prospective Students</a>
    
    <div class="image image--stylized">
      <div class="field__item">
        <img src={Placeholder} alt="leaves in water placeholder"/>
      </div>
    </div>
  </div>
</div>

<div class="wwu-image-link smaller"> 
  <div class="image-link">
    <a href="#">Prospective Students</a>
    
    <div class="image image--stylized">
      <div class="field__item">
        <img src={Placeholder} alt="leaves in water placeholder"/>
      </div>
    </div>
  </div>
</div>

<div className="wwu-image-link smaller simple blue"> 
  <div className="image-link">
    <a href="#">Prospective Students</a>
    
    <div className="image image--stylized">
      <div className="field__item">
        <img src={Placeholder} alt="leaves in water placeholder"/>
      </div>
    </div>
  </div>
</div>