수다닷컴

  • 해외여행
    • 괌
    • 태국
    • 유럽
    • 일본
    • 필리핀
    • 미국
    • 중국
    • 기타여행
    • 싱가폴
  • 건강
    • 다이어트
    • 당뇨
    • 헬스
    • 건강음식
    • 건강기타
  • 컴퓨터
    • 프로그램 개발일반
    • C언어
    • 비주얼베이직
  • 결혼생활
    • 출산/육아
    • 결혼준비
    • 엄마이야기방
  • 일상생활
    • 면접
    • 취업
    • 진로선택
  • 교육
    • 교육일반
    • 아이교육
    • 토익
    • 해외연수
    • 영어
  • 취미생활
    • 음악
    • 자전거
    • 수영
    • 바이크
    • 축구
  • 기타
    • 강아지
    • 제주도여행
    • 국내여행
    • 기타일상
    • 애플
    • 휴대폰관련
  • 프로그램 개발일반
  • C언어
  • 비주얼베이직

z-index 관련질문..

다인

2023.04.01

안녕하세요.

mid03의 이미지가 mid02이미지위에 있어야되서 z-index 값을 주려고하는데.. 잘안되서 여쭤봐요^^;;

!-- mid_home --
div class=mid_home
div class=mid01
ul
liimg src=../images/banner01.jpg alt= /pa href=#img src=../images/btn_rightGo01.gif alt= //a/p/li
liimg src=../images/banner02.jpg alt= /pa href=#img src=../images/btn_rightGo02.gif alt= //a/p/li
/ul
/div
div class=mid02
ul
liimg src=../images/manage01.jpg alt= /p class=arrow01a href=#img src=../images/icon_arrow.png alt= //a/p/li
liimg src=../images/manage02.jpg alt= /p class=arrow02a href=#img src=../images/icon_arrow.png alt= //a/p/li
liimg src=../images/manage03.jpg alt= /p class=arrow03a href=#img src=../images/icon_arrow.png alt= //a/p/li
liimg src=../images//manage04.jpg alt= /p class=arrow04a href=#img src=../images/icon_arrow.png alt= //a/p/li
/ul
/div
div class=mid03
img src=../images/img_193X298.jpg alt= /
pimg src=../images/dfsdf.jpg alt= //p
/div
/div
!-- // mid_home --

.mid_home {position:relative; background:#fcc;}
.mid01, .mid02 {float:left; z-index:100;}
.mid01 ul {overflow:hidden;}
.mid01 ul li {float:left; position:relative;}
.mid01 ul li p {position:absolute; bottom:38px; left:38px;}
.mid02 {z-index:100; width:304px; margin-top:9px;}
.mid02 ul li {float:left; position:relative;}
.mid02 ul li img {}
.mid02 ul li p.arrow01 {position:absolute; top:42px; right:32px;}
.mid02 ul li p.arrow02 {position:absolute; top:42px; right:29px;}
.mid02 ul li p.arrow03 {position:absolute; top:39px; right:40px;}
.mid02 ul li p.arrow04 {position:absolute; top:39px; right:18px;}
.mid03 {z-index:1; position:absolute; right:0;}
.mid03 img {border:1px solid #ccc; border-right:none;}
.mid_home:after {content:; display:block; clear:both;}

잘못된 부분 지적부탁드려요 ㅠㅠ

신청하기





COMMENT

댓글을 입력해주세요. 비속어와 욕설은 삼가해주세요.

  • 흰우유

    네 좋은 답변 감사합니다 저두 좋은정보 잘 배워갑니다~^^

  • 가온길

    의미상으로 보면 목록이나 항목에 문단이 들어가지 말라는 법은 없지요 그리고 li는 순서가 없는 목록형식입니다. 꼭 간단할 필요는 없지요 그래서 어긋난다고 할 순 없습니다 만약 긴 문단이 들어가야 한다면 다른 마크업이 더 효율적일테니 바꾸면 되겠지요
    마크업이란게 개인의 성향이 나타나기 때문에 뭐가 맞고 틀리다 판단이 힘듭니다 완전하게 규정을 벗어나지 않는이상 효율적인걸 찾아가는게 최적이겠지요

  • 루리

    li태그 블락태그 맞네요 잘못된 내용 정정합니다.

    들어갈수는 있지만 의미상 잘못된 사용법이라고 할 수 있습니다.

    li태그는 말 그대로 list item의 약자로서 간단한 목록이나 항목을 나타낼 때 쓰입니다.
    p태그는 문단을 구분하는 용도로서 p태그가 열리고 닫히면 하나의 문단이나 절을 나타냅니다.
    결국 레이아웃은 짤 수 있겠지만 웹표준(문서의 의미상)에 어긋나는 태그사용법이라고 할 수 있습니다.


    더불어 제가 질문자님의 태그를 확인해봤습니다만,

  • 바람

    li는 블럭요소입니다 p든 div든 쓸 수 있습니다.
    z-index는 레이아웃을 가지고 있는 요소에만 쓸 수 있습니다 position:(relative,absolute,fixed 같은) z-index를 주시려면 해당 속성을 주고 쓰세요~
    ex)mid01,02는 없네요~

  • 새솔

    음 제가알기론 li가 인라인 요소긴 하지만 블록요소가 들어갈수 있는걸로 알고있습니다. 예외로..
    그리고 이미지가 포개졌을때 mid02의 이미지가 위로 와야합니다 ㅠㅠ

  • 힘찬

    일단 li태그 안에는 p태그가 들어갈수가 없습니다. li태그는 인라인 태그인데
    p태그는 블락태그 이기 때문에 사용법이 잘못되셨습니다.

    그리고 확인해 봤는데 현재 말씀하신 이미지가 정상적으로 mid02보다 위에 위치하고 있습니다.

    말씀하신 부분이 이미지가 포개졌을때 위치값을 말씀하시는건지 아니면

    레이아웃상 이미지가 아래로 내려와서 다음 줄에서 게시되어야 하는지 질문이 모호해서 정확한 답변을
    드리기 힘드네요

    네이트온 친추해주시면 자세히 설명해드리

  • 희미햬

    100보다 큰수로 다 줘봤는데도 안되요 ㅠㅠ

  • 바름

    인덱스값이 낮아서 그래요 위로 드러나게 잡으시려면 101값을 주시면 됩니다 낮을수록 아래에 깔려요

  • 아이폰

    z-index 값이 클수록 위로 올라오는거 아닝가효? ㅎㅎ

번호 제 목 글쓴이 날짜
2694724 코딩시 폰트 문제; ㅠ 후력 2025-05-13
2694696 텍스트박스 입력에 관한 문제입니다. 딥공감 2025-05-13
2694668 [질문] 페이퍼비전 PointLight 관련 질문 드려요.. 두바다찬솔 2025-05-13
2694611 Flash Lite 2.1에서 BitmapData와 Matrix 지원안하나요? (3) 이플 2025-05-12
2694582 IE & 파이어폭스 (2) 흙이랑 2025-05-12
2694553 무비클립안의 duplicate 발동이 안돼네요; 딥보라 2025-05-12
2694523 자바 애플릿 질문좀 ^^ (6) 동이 2025-05-12
2694494 [질문] JAVA 또는 C++ 로 프로그램 개발시.. 레지스터리 등록 관련 의문점? (3) 우람늘 2025-05-11
2694469 익스6에서 css버그 나오는것 해결방법좀요 !!!! (6) 원술 2025-05-11
2694442 로컬에선 잘 나오는데 운영에 반영하면 이상하게 나와요. (8) 목화 2025-05-11
2694412 [질문] 이미지 로딩후 사이즈 조절할때 (1) 아담 2025-05-11
2694391 설치형 블로그 쓰시는 분들 어떤거 쓰세요?? (7) AngelsTears 2025-05-10
2694362 Microsoft SQL Server에서 서버만드는법 어둠 2025-05-10
2694333 for문으로 돌린 이름의 제어 (4) 레이 2025-05-10
2694308 이미지 css 도와주세요 ㅠㅠ (2) 애기 2025-05-10
2694223 [급질문]스크롤스파이의 offset값 진나 2025-05-09
2694195 li에 이미지 넣고 세로로 메뉴 구성하는 경우 (1) 예님 2025-05-09
2694167 canvas 질문요. (4) 찬늘봄 2025-05-08
2694136 왜 이렇게 나오는지 이해가 잘 가지 않네요. 부탁드리겠습니다... (2) 세련 2025-05-08
2694111 div , css 공부하고있는데요 잘모르겠어요.. 도와주세요 ㅠ_ㅠ (10) 모람 2025-05-08
<<  이전  1 2 3 4 5 6 7 8 9 10  다음  >>

수다닷컴 | 여러분과 함께하는 수다토크 커뮤니티 수다닷컴에 오신것을 환영합니다.
사업자등록번호 : 117-07-92748 상호 : 진달래여행사 대표자 : 명현재 서울시 강서구 방화동 890번지 푸르지오 107동 306호
copyright 2011 게시글 삭제 및 기타 문의 : clairacademy@naver.com