분류 전체보기105 40일차_CSS_float_clear / both_CSS 파일 연결 21.05.07 CSS @float => Float 이란 옵션??은 내가 원하는 방향에 요소를 띄운다. - 위 사진은 float 에 right 옵션을 준것. ㅁㄴㅇ ㅁㄴㅇ @clear / both - clear : float 속성의 영향을 받지 않도록 설정하는 속성 - both : float 속성의 left와 right의 영향을 받지 않는 값 - 위는 float과 clear 속성을 활용한 예제이다. - 위는 1번과 2번에는 float의 left 속성을 주었고, 3번 div에는 clear 속성을 준 결과이다. 만일 3번에 clear속성을 주지 않으면 아래와 같은 결과를 볼 수 있다. 3번 div는 분명 화면 안에 있다. 단지, 1번과 2번에 가려져 보이지 않는것 뿐이다. @VS Code ( 자동완성 ) -.. 2021. 5. 7. 39일차_CSS_margin_padding_border_overflow 21.05.06 CSS @바깥여백 속성 - margin => 바깥 여백에 공간을 주는 Tag. 해당 것을 익히기 위해 Tag를 사용하여 실습 진행하였다. @box-sizing / padding => 솔직히 이에 대한 내용은 이해는 잘 못했다. (특히, box-sizing ) - padding 은 margin 과 반대로 공백을 더 늘려주는 기능을 갖는다. - 아래는 이에 대한 실습이다. - 위를 보면 핑크색 의 경우 padding Tag로 인해 400X400의 크기를 가져야하지만, box-sizing 으로 인해 원래 크기인 200X200이 되었다. @border - 테두리 만들기 => 라는 기능을 이용해 테두리에 대한 설정을 할 수 있다. 아래 사진은 를 활용해 자색고구마를 만들었다. @position =.. 2021. 5. 6. 38일차_CSS_선택자_공간분할태그_명시도 계산_크기 단위 21.05.04 CSS @계층 선택자 => 특정위치의 요소를 계층적 구조로 요소로 선택하는 것을 "계층 선택자"라 한다. 각 계층적 구조에 따라 선택하는 방법 또한 다르다 아래의 사진을 참고하여 - ul Tag의 자식인 li Tag를 선택한다고 하면, "body>ul>li" 혹은 "body li" 이렇게 2가지 방법이 있다. - 꺾쇠 기호를 통해 자식을 선택할 수도 있지만 공백을 통해 바로 자손을 택할 수도 있다. - 하지만, 정확하게 접근하기 위해 자식 선택자의 사용빈도가 높다고 한다. 한번 더 확인해보면, - span Tag를 선택하는 방법은 "div>ol>span"과 "div span" 이렇게 2가지 방법이 있다. - 형제태그를 선택하는 방법을 통해 span Tag를 포함한다고하면 "li~span".. 2021. 5. 4. 37일차_VSC_HTML 21.05.03 HTML @input Tag 1번째는 단순한 텍스트를 입력하는 input태그 이름을 입력하세요 : 아이디를 입력하세요 : - 무언가를 적을 수 있는 공간을 만드는 Tag - value 라는 옵션을 통해 초기 적힌 글귀를 정할 수 있다. 해당 값은 지워지는 일반 Text이다. - placeholder 라는 옵션을 통해 커서를 놓으면 사라지는 문구를 지정할 수 있다. input Tag 공간 안이 비어 있다면 지속적으로 해당 문구가 표시된다. @datalist / select Tag 소녀시대 원더걸스 이메일 선택 naver daum - datalist 의 경우 왼쪽처럼 내가 적은것과 연관된걸 선택할 수 있다. - 최근 검색 목록과 같은 기능. 내가 타이핑한것과 연관된 단어가 Datalist에 .. 2021. 5. 3. 1차_프로젝트_21.04.22~04.28 보호되어 있는 글 입니다. 2021. 5. 2. 독서 천재가 된 홍대리 보호되어 있는 글 입니다. 2021. 5. 2. 이전 1 ··· 9 10 11 12 13 14 15 ··· 18 다음
