Ella 프론트엔드일지

✅참고 동영상링크 https://www.youtube.com/watch?v=c19Mjg-ivxc&t=94s ✅margin collapsing(마진 겹침, 마진 병합현상) ➡️ margin 병합현상 조건 1. 인접해있는 Block 요소끼리만 일어남 2. 상하단만 해당사항(좌우는 X) 1)형제요소의 마진병합 현상 코드펜에서 아래와 같이 코드를 작성했다. div 박스에 margin값을 상하좌우 모두 20px을 주었다. 그러면 베이지색 박스의 margin-bottom:20px 과 핑크색 박스의 margin-top:20px 이 만나서 40px이 되어야하는게 아닐까? 했지만.. 빨간색 빗금친 부분처럼 20px만 보여지고 있다... 이것이 바로 마진겹침현상! - 왜 이런현상이 일어나지...? 의도된 부분이다. CSS..

사각형의 모서리를 둥굴게 만드려면 어떻게 해야할까?/ border-radius를 쓰자! ✅border-radius 1)기본값 : 0 둥글게 없음. 그냥 사각형 모양 2) px,em,vw등 단위를 지정하면 모서리가 둥그래진다. ➡️코드펜 아래 예시를 살펴보자 div 사격형 요소에 border-radius :10px; 만큼 주었다. 결과를 보니 네 각이 모두 10px만큼 둥그래졌다. 원의 반지름 10px 만큼 둥그래지는 개념이다. ➡️그런데 네개의 각 말고 한 각만 둥글게 하고싶다면?? border-radius 속성도 단축속성이기에 한각씩만 둥글게 할수있다. 시계방향으로 간다고 생각하면 된다.

📝 참고문서 : https://ossam5.tistory.com/73 https://jong99.tistory.com/36 https://pks2974.medium.com/iframe-%EA%B0%84%EB%8B%A8-%EC%A0%95%EB%A6%AC%ED%95%98%EA%B8%B0-1cd866b71c8f 1️⃣iframe이란? inline frame 의 줄임말이며, 페이지에 Frame을 넣을 때 사용 즉, 웹페이지 안에 또다른 웹페이지를 삽입할 수 있는 태그 src 속성으로 불러울 HTML 링크를 설정한다. 아래는 내 티스토리 블로그 예시! iframe 보통은 iframe 태그는 Youtube 영상을 불러올때 많이 사용된다. 어떻게 확인하냐?? Youtube에서 내가 공유하고 싶은 동영상 공유를 클릭하..

멋쟁이사자처럼 프론트엔드 스쿨3기에서 공부한걸 바탕으로 정리한 내용입니다. 비판은 언제나 환영입니다!! 가르쳐주세요 ㅠㅠㅠㅠ 공부한지 2달도 안된 새내기 개발자 준비생🐥🐥 html을 공부해본 사람은 알것이다. div 의 지옥을 말이다. 아래 태그는..내가 실습하고 있는 div로 뒤범벅 된 실습자료 아우리 1시간 전 4K 빔프로젝터 가성비 최강으로 선택했어요 4K빔프로젝터 가성비 최강으로 선택했어요. 날씨가 날씨인지라 요즘 마음이 싱숭생숭한게 가을 타는 사람이 아닌 봄을 타고있었어요.하루하루 시간이 모의미하게 흘러가는 거 같고 재미있는걸 찾지 못해 이리저리 헤매는 사람처럼 즐거운걸 못찾고있 결과페이지는 아래와 같다. ✅ div 로만 뒤범벅된게 뭐 어째서?? div 는 그냥 박스, 의미가 없는 태그다. 웹브..