>  기사  >  웹 프론트엔드  >  CSS3을 사용하여 도라에몽 코드 구현

CSS3을 사용하여 도라에몽 코드 구현

高洛峰
高洛峰원래의
2017-03-28 10:15:111644검색


이 글에서는 주로 css3를 사용하여 도라에몽 코드를 구현하는 방법을 소개하는데, 관심 있는 친구들은 참고할 수 있습니다.

<!doctype html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>Document</title></head><body><p class="doraemon">
    <p class="head">
        <p class="eyes">
            <p class="eye left"><p class="black bleft"></p></p>
            <p class="eye right"><p class="black bright"></p></p>
        </p>
        <p class="face">
            <p class="white"></p>
            <p class="nose"><p class="light"></p></p>
            <p class="nose_line"></p>
            <p class="mouth"></p>
            <p class="mouth"></p>
            <p class="whiskers">
                <p class="whisker rTop r160"></p>
                <p class="whisker rt"></p>
                <p class="whisker rBottom r20"></p>
                <p class="whisker lTop r20"></p>
                <p class="whisker lt"></p>
                <p class="whisker lBottom r160"></p>
            </p>
        </p>
    </p>
    <p class="choker">
            <p class="bell">
                <p class="bell_line"></p>
                <p class="bell_circle"></p>
                <p class="bell_under"></p>
                <p class="bell_light"></p>
            </p>
        </p>
        <p class="bodys">
            <p class="body"></p>
            <p class="wraps"></p>
            <p class="pocket"></p>
            <p class="pocket_mask"></p>
        </p>
        <p class="hand_right">
            <p class="arm"></p>
            <p class="circle"></p>
            <p class="arm_rewrite"></p>
        </p>
        <p class="hand_left">
            <p class="arm"></p>
            <p class="circle"></p>
            <p class="arm_rewrite"></p>
        </p>
        <p class="foot">
            <p class="left"></p>
            <p class="right"></p>
            <p class="foot_rewrite"></p>
        </p>
    </p></p></body></html>


으으아아아

위 내용은 CSS3을 사용하여 도라에몽 코드 구현의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.