<p><abbr title="National Aeronautics and Space Administration">NASA</abbr> is a U.S. government agency that is responsible for science and technology related to air and space.</p>

abbr {
    color: chocolate;
}

@media (hover: hover) {
    abbr:hover {
        color: limegreen;
        transition-duration: 1s;
    }
}

@media not all and (hover: hover) {
    abbr::after {
        content: ' (' attr(title) ')';
    }
}