css如此强大你知道吗

看个这个大神纯 CSS 绘制《辛普森一家》人物头像我惊呆了，css如此牛x

  <div id="wrap">        <div class="container header">            <div class="row">                <div class="col-md-12">                    <h1>纯 CSS 绘制《辛普森一家》</h1>                    <p style="color:green;margin-top:30px">温馨提示：为保证最佳的效果，请在 Chrome、Firefox 和 Safari 等现代浏览器中浏览。</p>                </div>            </div>        </div>                       <!-- Hair and top of head -->                <div class="hair1"></div>                <div class="hair2"></div>                <div class="body head-top"></div>                <div class="no-border body head-main"></div>                <!-- The 'M' above the ear -->                <div class="no-border m1"></div>                <div class="no-border m2"></div>                <div class="no-border m3"></div>                <div class="no-border m4"></div>                <!-- The neck parts -->                <div class="no-border neck1"></div>                <div class="body neck2"></div>                <!-- The ear -->                <div class="body ear">                <div class="no-border inner1"></div>                <div class="no-border inner2"></div>                <div class="no-border body clip"></div>                </div>                <!-- The mouth -->                <div class="mouth">                <div class="mouth5"></div>                <div class="mouth2"></div>                <div class="mouth1"></div>                <div class="mouth7"></div>                <div class="no-border mouth3"></div>                <div class="no-border mouth4"></div>                <div class="no-border mouth6"></div>                <div class="no-border mouth8"></div>                </div>                <!-- The right eye -->                <div class="right-eye">                <div class="no-border right-eye-pupil"></div>                <div class="no-border body eyelid-top"></div>                <div class="no-border body eyelid-bottom"></div>                </div>                <!-- The nose -->                <div class="body nose"></div>                <div class="body nose-tip"></div>                <!-- The left eye -->                <div class="left-eye">                <div class="no-border left-eye-pupil"></div>                <div class="no-border body eyelid-top"></div>                <div class="no-border body eyelid-bottom"></div>                </div>            </div>                    </div>                    <h2>Homer</h2>                                    </div>                <div class="col-md-3">                    <div class="bart" style="margin-top: 75px;">                        <div class="head">                <div class="no-border body hair hair1"></div>                <div class="no-border body hair hair2"></div>                <div class="no-border body hair hair3"></div>                <div class="no-border body hair hair4"></div>                <div class="no-border body hair hair5"></div>                <div class="no-border body hair hair6"></div>                <div class="no-border body hair hair7"></div>                <div class="no-border body hair hair8"></div>                <div class="no-border body hair hair9"></div>                <div class="body mouth-lip2"></div>                <div class="no-border body head-left1"></div>                <div class="no-border body head-left2"></div>                <div class="no-border body head-left3"></div>                <div class="no-border body head-left4"></div>                <div class="no-border body head-left5"></div>                <div class="no-border body head-left6"></div>                <div class="no-border body head-left7"></div>                <div class="body eyelid"></div>                <div class="no-border body mouth"></div>                <div class="body mouth-lip"></div>                <div class="no-border body head-right2"></div>                <div class="no-border body head-right1"></div>                <div class="no-border body head-right3"></div>                <!-- The ear -->                <div class="body ear">                <div class="no-border inner1"></div>                <div class="no-border inner2"></div>                <div class="no-border body clip"></div>                </div>                <!-- The right eye -->                <div class="right-eye">                <div class="no-border right-eye-pupil"></div>                <div class="no-border body eyelid-top"></div>                <div class="no-border body eyelid-bottom"></div>                </div>                <!-- The nose -->                <div class="no-border body nose"></div>                <div class="body nose-tip"></div>                <!-- The left eye -->                <div class="left-eye">                <div class="no-border left-eye-pupil"></div>                <div class="no-border body eyelid-top"></div>                <div class="no-border body eyelid-bottom"></div>                </div>                <div class="no-border mouth-smile"></div>            </div>                    </div>                    <h2>Bart</h2>                                    </div>                <div class="col-md-3">                    <div id="marge">                        <div class="head">                <div class="no-border body head-main"></div>                <div class="body mouth-lip2"></div>                <div class="body mouth-lip"></div>                <div class="no-border body neck"></div>                <div class="no-border body mouth"></div>                <div class="no-border body neck2"></div>                <div class="no-border body neck3"></div>                <div class="no-border mouth-smile"></div>                <div class="hair hair1 hair-circle"></div>                <div class="hair hair2 hair-circle"></div>                <div class="hair hair3 hair-circle"></div>                <div class="hair hair4 hair-circle"></div>                <div class="hair hair5 hair-circle"></div>                <div class="hair hair6 hair-circle"></div>                <div class="hair hair7 hair-circle"></div>                <div class="hair hair8 hair-circle"></div>                <div class="hair hair9 hair-circle"></div>                <div class="hair hair10 hair-circle"></div>                <div class="hair hair11 hair-circle"></div>                <div class="hair hair12 hair-circle"></div&