FIX 6 구글 adsense margin 오류 수정 .revenue_unit_wrap { margin-top: 20px; margin-bottom: 20px; } 티스토리 블로그에서 보여 주는 구글 애드센스 광고 CSS 코드를 개발자 도구로 살펴보았습니다. 상, 하 각각 20픽셀의 마진을 주어 본문의 내용과 거리를 두고 있습니다. 간단하게 그리면 아래와 같은 구조를 이루게 됩니다. block element인 "wrap" 안에 그리고 "container" 안에 배치하였습니다. "container" 박스 안의 마지막 개체이므로 애드센스 광고 하단의 20px margin이 "container" 하단 경계선과 접합니다. 아래 그림은 구글 크롬, 마이크로소프트 엣지, 그리고 Mozilla Foundation의 Firefox 브라우저들에서 렌더링 된 실제 모습을 간.. 2022. 6. 21. 티스토리 북클럽 스킨의 홈프로모션 슬라이더 컬러와 버튼 오류 수정 티스토리 블로그에서 제공하는 북클럽 스킨의 홈 화면 슬라이더 북클럽 스킨을 티스토리 블로그에 적용하면 초기 홈 화면의 상단에 "main-slider"라고 하는 최대 3개 이미지의 슬라이더 기능을 구현합니다. ※ 2022년 4월 11일 내용 변경 메인 슬라이더는 블로그 관리자에게 3개의 이미지와 연결되는 타이틀과 버튼의 색을 각각 변경할 수 있는 옵션을 제공합니다. - 프로모션 문구와 색상, - 프로모션 자세히 보기 색상과 Hover 색상 ※ "자세히 보기"는 "바로 가기" 버튼을 뜻합니다. 1개의 이미지에만 옵션이 적용되는 문제 발생 최대 3개의 이미지를 슬라이더에 사용할 수 있으니까 각각의 개별적인 옵션이 적용되어야 하는 데, 첫 번째 이미지에서만 정상적으로 나타나고 나머지 2개의 이미지에 관련된 색은.. 2022. 3. 12. Position Sticky를 구현하는 Fixed JS 코드 3차 수정본 1. 원글: Position Sticky를 구현하는 Fixed JS 코드 오류 수정 2. 수정: Position Sticky를 구현하는 Fixed JS 코드 2차 수정본 3. 수정: 본문 4. 수정: Position Sticky를 구현하는 Fixed JS 코드 4차 수정본 5. 활용: Position Sticky를 구현하는 Fixed JS 코드 활용 2, 3차 수정 코드 비교하고 간단한 설명 덧붙입니다. ※ The HTMLElement.offsetTop read-only property returns the distance of the outer border of the current element relative to the inner border of the top of the offsetParent.. 2021. 6. 13. Position Sticky를 구현하는 Fixed JS 코드 2차 수정본 1. 원글: Position Sticky를 구현하는 Fixed JS 코드 오류 수정 2. 수정: 본문 3. 수정: Position Sticky를 구현하는 Fixed JS 코드 3차 수정 4. 수정: Position Sticky를 구현하는 Fixed JS 코드 4차 수정 5. 활용: Position Sticky를 구현하는 Fixed JS 코드 활용 윗글에 이어서 다시 수정한 부분을 반영하여 설명 진행합니다. 수정 내역 1. 블로그의 댓글 리스트에서 한 항목 링크를 누르면 페이지가 열리면서 하단 댓글 리스트로 이동합니다. 이때 "position: fixed"입니다. 페이지의 최상단으로 이동하면 "position: static"으로 변경되어야 하는 데, 오류 때문에 바뀌지 않습니다. 위치 코드를 출력하는 검사.. 2021. 6. 10. Position Sticky를 구현하는 Fixed JS 코드 오류 수정 1. 원글: 본문 2. 수정: Position Sticky를 구현하는 Fixed JS 코드 2차 수정 3. 수정: Position Sticky를 구현하는 Fixed JS 코드 3차 수정 4. 수정: Position Sticky를 구현하는 Fixed JS 코드 4차 수정 5. 활용: Position Sticky를 구현하는 Fixed JS 코드 활용 Position Sticky는 웹 페이지의 일부 Element가 사전 설정한 지점에서 움직임을 중지하고 고정되어 Position Fixed의 기능을 시작하는 매우 유용한 CSS 코드입니다. "Position Relative + Position Fixed"를 하나로 통합한 것이라고 말할 수 있습니다. 대형 포털과 블로그 등 여러 사이트의 페이지 상단에 배치된 내.. 2021. 4. 19. Dell 노트북 어댑터 고장 분해 수리 Dell AC/DC Adapter PA-3E Family 모델명: DA90PE3-00 REF. NO.: ADP-90VH D 입력: 100-240V ~ 1.5A / 교류(AC) 출력: 19.5V, 4.62A / 직류(DC) 제조업체: DELTA ELECTRONICS INC. CN-0WTCOV-48661- 081-JSF5-AOO Made in China DP /N 0WTCOV 어댑터 분해 볼트를 사용하여 조립한 것이 아니라 본드 혹은 양면 접착테이프를 사용하여 외부 플라스틱 커버에 부착한 제품입니다. 위와 아래 플라스틱이 맞닿은 중간 부분을 일자 드라이버로 끼우고 양쪽으로 당기면서 조금씩 분리합니다. 한 번에 큰 힘을 주지 말고 본드나 접착테이프가 분리될 시간을 주고 천천히 분해합니다. 전기의 입출력 변.. 2021. 3. 7.
