특정 아이디나 클래스 이후에 특정 아이디나 클래스가 있을 때 ‹ Web Server Tip

페이지 정보

shadow2fox 1,924 2018.08.15 01:51

특정 아이디나 클래스 이후에 특정 아이디나 클래스가 있을 때

이후 특정 아이디나 클래스에 간격을 준다거나 꾸밀 때 유용할 듯
#a라는 아이디, .a라는 클래스 이후에 #b라는 아이디, .b라는 클래스가 올 때


#a + #b {
  margin-top: 10px;
}
.a + .b {
  margin-top: 10px;
}

위 css를 간단히 응용하면 될 듯 하고 특정 아이디나 클래스 이후에 다중의 동일 아이디나 다중의 동일 클래스에게 효과를 주고 싶다면 아래와 같다.


#a ~ #b {
  margin-top: 10px;
}
.a ~ .b {
  margin-top: 10px;
}

CSS 특정 아이디 클래스 이후 선택 적용

shadow2fox - 회원등급 : 자연／Level 142 - 포인트 : 2,539,573

레벨 142

경험치 3,034,326

Progress Bar 73%

- 가입일 : 2015-03-10 12:21:44

- 서명 : 인간에게 가장 큰 선물은 자기 자신에게 기회를 주는 것이다. - 크리스 가드너, Chris Gardner -

- 자기소개 : There's never a shortcut to happiness.

첫 번째 댓글을 남겨 주세요

번호	제목	글쓴이	날짜	조회	추천
5	댓글+2개🏆 구문(코드) 강조 Prism.js에서 첫 라인이 빈칸으로 추가되는 문제 해결하기	shadow2fox	2021.06.22	1,123	2
열람중	🏆 🚩 특정 아이디나 클래스 이후에 특정 아이디나 클래스가 있을 때	shadow2fox	2018.08.15	1,925	0
3	🏆 webkit-transform 스타일이 마우스 오버시 보이는 flickering 증상 해결하기	루루아빠	2016.05.26	2,598	0
2	🏆 div 클래스에 :last-child css 스타일 적용하기	루루아빠	2016.03.15	2,203	0
1	🏆 gifplayer 플레이시 gifplayer-wrapper 아래 모든 div가 아래로 밀리는 현상 해결하기	루루아빠	2016.02.16	2,591	0

랭킹	글내용	조회
1	특정 div의 내용을 일정 시간마다 새로고침하기 루루아빠 2016-03-20 06:24	14,794
2	영카트 5.3.2.9 shadow2fox 2019-05-30 00:39	11,631
3	button으로 유튜브 재생 및 정지 제어하기 댓글 +1개 루루아빠 2017-02-21 19:12	9,548
4	jQuery를 이용한 링크 자동 클릭(auto click) 댓글 +2개 루루아빠 2015-06-27 02:19	8,304
5	CKeditor 4.x 소스 보기시 자동으로 공백 태그( ) 추가되는 문제 해결하기 댓글 +1개 루루아빠 2016-05-20 21:53	7,123
6	modal 오픈시 modal-dialog 아래 background body 스크롤 안되게 하기 루루아빠 2015-07-16 00:05	6,552
7	[PHP 7.2.x] count(): Parameter must be an array or an object that implements Countable 에러 해결하기 댓글 +1개 shadow2fox 2020-03-09 14:37	6,480
8	그누보드 5.4.4 댓글 +2개 shadow2fox 2021-01-05 10:58	6,303
9	영카트 5.0.41 패치 루루아빠 2015-07-13 14:53	6,177
10	이윰빌더와 그누보드 패치시 수정할 파일들 루루아빠 2015-06-23 19:13	6,076