- 질문 게시판입니다.
Date 15/11/06 09:12:47
Name   얼그레이
File #1   rabbit.png (75.1 KB), Download : 4
File #2   markup.png (100.0 KB), Download : 5
Subject   css 질문입니다.




css 작업중인데 막혀서 질문드립니다.

이 css 작업을 어떻게 해야 토끼가 앞으로 오나요?
일단 항목으로 작업해서 float를 띄우긴 했는데.. 그냥 이미지를 하나로 자르는게 더 좋을까요?

<ul class="animal">
                                <li class="rabit" src="earth/rabbit.animal" alt="토끼" />
                                <li class="carrot" src="earth/carrot.food" alt="당근" />
</ul>

밑에 문서 첨부합니다.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko">
<head>
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
        <title>rabbit and landscape</title>
        <style type="text/css">
                body{width:580px;height:450px;}
                #picture {width:573px;height:432px;border:2px solid #000;overflow:hidden;}
                #picutre #sky .animal{float:right;width:180px;height:150px;}
                #picture #earth{background:url(earth/field.earth)no-repeat 0 0;height:240px;position:relative;}
                #picture #earth .aniaml{position:absolute;left:208px;bottom:44px;}
                #picture #earth .aniaml li{float:left;}
                #picture #earth .plant .left{position:absolute;left:50px;bottom:84px;}
                #picture #earth .plant .right{position:absolute;right:20px;bottom:84px;float:left;overflow:hidden;width:165px;height:210px;}
                #picture #earth .plant .right .tree{float:left;width:20px;}
                #picture #earth .water{position:absolute;bottom:0;left:0;}
                #picture #earth .plant{position:absolute;bottom:0;right:0;}
                #picture #earth .plant li{float:left;letter-spacing:-5px;}
                #copyright{display:none;}
        </style>
</head>
<body>
        <div id="picture">
                <div id="sky">
                        <h1><img src="sky/red_sun.light" alt="sun" /></h1>
                        <div class="animal">
                                <img src="bird/five_birds.animal" alt="독수리오형제" />
                        </div>
                </div>
                <div id="earth">
                        <ul class="animal">
                                <li class="rabit" src="earth/rabbit.animal" alt="토끼" />
                                <li class="carrot" src="earth/carrot.food" alt="당근" />
                        </ul>
                        <div class="plant">
                                <div class="left">
                                        <img src="tree/tree1.plant" alt="나무" />
                                </div>
                                <div class="right">
                                        <img src="tree/two_tree.plant" width=165 height=210 alt="나무" />
                                        <img class="tree" src="tree/trees.plant" alt="나무" />
                                </div>
                        </div>
                        <div class="water">
                                <img src="water/river.water" alt="강" />
                        </div>
                        <ul class="plant">
                                <li><img src="tree/grass1.plant" alt="풀1" /></li>
                                <li><img src="tree/grass2.plant" alt="풀2" /></li>
                                <li><img src="tree/grass3.plant" alt="풀3" /></li>
                        </ul>
                </div>
                <div id="copyright">
                        <p>얼그레이</p>
                </div>
        </div>
</body>
</html>



0


목록
번호 제목 이름 날짜 조회 추천
404 문화/예술에프엑스 루나 강지영 닮지 않았나요? 3 王天君 15/11/01 4601 0
405 기타노트4 볼륨버튼 불량문제 전크리넥스만써요 15/11/02 3697 0
406 홍차넷네이버 블로그 글을 편하게 홍차넷에 복사 붙여넣기를 하려면? 14 oh! 15/11/02 5248 0
407 기타월급 통장의 조건 같은게 있나요? 1 고도 15/11/02 3176 0
408 기타요즘은 핸드폰 개통 어떻게 되나요? (비공개밴드같은) 4 전크리넥스만써요 15/11/02 4710 0
409 교육기계공학과 편입 면접이있습니다. 공부를 어떻게해야 할까요?? 3 불꽃늑대 15/11/02 6354 0
410 기타여초넷에 질문입니다! 41 ORIFixation 15/11/03 4489 0
411 기타공유기 질문입니다 4 김치찌개 15/11/04 2598 0
412 의료/건강30 년 간 의학은 어느 정도 발전한 건가요? 24 이사무 15/11/04 4044 0
413 기타구두를 찾습니다. 11 April_fool 15/11/04 3129 0
414 기타캐나다에 거주하고 계신(거주하셨던) 분 있으신가요? 9 하얀늑대 15/11/04 3860 0
415 의료/건강눈이 안좋은 것 같습니다 2 헬리제의우울 15/11/04 3409 0
416 기타공유기 둘중에서 어떤게 좋을까요??.jpg 4 김치찌개 15/11/04 2812 0
417 철학/종교혹시 성선설 vs 성악설은 결론이 난 주제인가요? 10 Lionel Messi 15/11/04 5456 0
418 IT/컴퓨터본인의 파일을 Crypt0L0cker 바이러스으로 코딩했습니다 8 jsclub 15/11/05 5584 0
419 기타공유기 이 중에서 어떤게 좋을까요??.jpg 3 김치찌개 15/11/05 2653 0
420 연애커플링 맞추려고 하는데 14K 18K 뭐가 좋을까요 20 대통령 15/11/05 8588 0
421 연애빼빼로데이 어떻게들 보내시나요? 16 나쁜피 15/11/05 4170 0
422 의료/건강불안장애가 있는것 같은데요... 4 거대한다람쥐 15/11/05 2872 0
423 기타크리스마스 느낌의 남자 노래 5 헤칼트 15/11/05 3124 0
424 의료/건강이 기사는 왜 놀라운가요. 33 눈부심 15/11/06 4164 1
425 IT/컴퓨터css 질문입니다. 25 얼그레이 15/11/06 3937 0
426 의료/건강MRI 관련 질문입니다. 9 April_fool 15/11/06 7118 0
427 기타이 중에서 어떤 제품이 좋을까요??.jpg 2 김치찌개 15/11/06 3043 0
428 기타안녕하세요. 노래 질문입니다. 1 레이드 15/11/06 2694 0
목록

+ : 최근 2시간내에 달린 댓글
+ : 최근 4시간내에 달린 댓글

댓글