htmlcss
-
[위코드 35기 precourse-html-css] 위코드 첫 날, htmlcss 총정리, 배운 내용 복습프론트엔드 개발자가 될거야./htmlcss 2022. 6. 20. 21:45
들여쓰기, 띄어쓰기 (스페이스바 기능) 방법1   방법2 => text-indent 을 이용 .js-description { text-indent: 50px; } 밑줄긋기 p { text-decoration: underline; } 이처럼 text-decoration를 이용한다고 알고있지만 밑줄의 두께나 색깔 등, 완벽하게 커스터마이징 하기가 어렵다. 그래서 내가 원하는 스타일로 밑줄을 칠 수 있게 border-bottom으로 구현하는 것을 더 선호해야한다. CSS selector 표현 p.p-tag => p태그 이면서 p-tag클래스 .pre span => pre클래스 내부에 있는 span태그 .a div .b .pre span => a클래스 내부에, div태그 내부에, pre클래스 내부에 있는..
-
HTML input checkbox프론트엔드 개발자가 될거야./htmlcss 2022. 6. 15. 17:17
// 복수 선택 가능한 체크박스 // 단일 선택 체크박스 이름 삽입 시 태그를 사용하면 글씨 영역을 클릭해도 checkbox 영역이 클릭 된다. 방법 1 오늘 할 일 방법 2 오늘 할 일 체크 박스 그룹 지정 여러 체크 박스를 하나의 그룹으로 지정하고 싶을 때, name 속성을 같은 값으로 지정하기 공부하기 잠자기 카페가기 체크박스 checked/unchecked 기본 설정은 unchecked이고 특정 체크박스에 체크 표시를 하고 싶으면 checked 속성명 삽입하기
-
[위코드 35기]HTML, CSS로 자기소개 페이지 만들기프론트엔드 개발자가 될거야./htmlcss 2022. 6. 13. 16:17
위코드 사전스터디 첫번째 과제는 HTML,CSS로 자기소개 페이지 만들기! 되게 간단해보이지만 메뉴를 어떻게 구성하고 어떠한 내용을 넣고 어떻게 레이아웃을 할지 많은 고민 끝에 탄생했다. 회사를 다니면서 작업한 거라 시간은 많이 부족했다. 웹 페이지를 만들 때 신경쓴 부분은 정 가운데 정렬 메뉴에 hover하면 커지는 효과 메뉴 누르면 해당 부분으로 이동 마음에 드는 한글 폰트 찾기, 글자 밑줄 긋기 짤짤이 이정도.. 1. 정 가운데 배치 display: flex; flex-direction: column; (or row) justify-content: center; // 수직 가운데 정렬 align-items: center; // 수평 가운데 정렬 text-align: center; // 텍스트 가운데..