HTML CSS62 [HTML] 기본문법: p태그 내부에 블록태그 작성 인라인 태그 내부에는 블록태그를 작성할 수 없고, flow content로 분류되는 p태그의 사용법 p 태그 내부에 ul > li 태그를 작성하니 Prettier 에러 발생 OUTPUT 결과: p 닫힘태그가 문제라고 뜸 (이미 다른 태그에 의해 닫혔을 수 있음) 자세한 내용: https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags HTML Standard The attribute name, followed by zero or more ASCII whitespace, followed by a single U+003D EQUALS SIGN character, followed by zero or more ASCII .. 2021. 8. 30. [CSS, JSP] Bootstrap을 사용한 페이지네이션(active 클래스 적용) 이전에 작성해둔 게시판 페이징 처리를 부트스트랩의 페이지네이션 기능을 이용하여 CSS 2021.08.23 - [Java 및 JSP] - [JSP] 게시판 페이징 처리 [JSP] 게시판 페이징 처리 2021.08.17 - [Java 및 JSP] - [JSP] DTO를 생성하면서 익히는 페이징 처리 과정 [JSP] DTO를 생성하면서 익히는 페이징 처리 과정 DTO(Data Transfer Object) 데이터를 오브젝트로 변환하는 객체로 VO는 DB에서.. wheneveryouwantsz.tistory.com 먼저 Bootstrap 홈페이지에서 CSS 링크를 copy해서 head 태그 내부에 작성 기존에 작성된 페이지네이션 수정 « ${pageNum } ${pageNum } « 부트스트랩 클래스가 작성된 .. 2021. 8. 24. [CSS] float 속성과 해제(가상요소를 만들어 배경 적용) float 블록 요소를 인라인 요소로 바꿔 좌측이나 우측부터 차례로 나열하는 속성 float-left: 가장 왼쪽의 빈 공간부터 차례대로 나열 float-right: 가장 오른쪽의 빈 공간부터 차례대로 나열 clear float의 흐름을 해제시키는 속성으로 원래 구성된 레이아웃에서 변경이 있을 때 사용 clear-left: float된 박스 중 왼쪽이 높이가 낮을 때 왼쪽부터 채워줌 clear-right: float된 박스 중 오른쪽이 높이가 낮을 때 오른쪽부터 채워줌 clear-both: 가장 많이 사용, 해당 속성을 받은 태그는 float과 상관없이 다음줄로 이동 body 태그 내부 작성, 박스들을 만들어줌 .contents { background-color: black; width: 500px; h.. 2021. 8. 19. Day3: CSS 입문 HTML에 CSS(styles.css) 파일을 연결하는 방법 @import "styles.css"; 타입 선택자(type selector) 태그의 이름을 작성하여, 해당 태그와 일치하면 다른 조건은 고려하지 않고 적용 출력: 아이디 선택자(id selector) 태그의 이름과는 관계없이 특정 태그에 부여된 id만 고려하여 적용 → id는 문서 내부에 하나만 존재해야함 - 위의 title과 content라는 id는 한번 사용했기 때문에 더 이상 작성될 수 없음 id는 해시태그(#)를 사용해 작성 출력: 클래스 선택자(class selector) id 선택자와 같이 특정 태그에 부여된 class를 고려하여 작성되나, 두개 이상 작성되어도 됨 → .클래스명 {css 요소명} 으로 작성 출력: 전체 선택자(al.. 2021. 6. 20. Day2: HTML 심화 태그 자주 쓰이는 의 속성 number, date 출력: 속성 태그 안에 required 라는 속성을 이용해서 유효성검사_작성되지 않은 내용은 경고창이 뜸 출력: placeholder라는 속성을 작성해서 어떤 내용을 작성해야하는지 힌트를 줌 출력: readonly라는 속성을 작성해서 해당 값은 value에 들어간 내용을 가지며, 수정되지 않음 출력: 그룹핑 많은 홈페이지, 어플에서 쓰이는 구분 : 문서의 머리말을 나타냄 : header 내부에서 메뉴바를 나타냄 , , : 화면을 표현 : 주소나 연락처 등 하단에 표시할 내용을 나타냄 block의 속성을 가진 태그를 작성해서 그룹핑 출력: 각 영역을 구분하기 위해서 태그에 div { border: 2px dotted tomato; } 작성 2021. 6. 12. Day2: HTML 입문 2 태그 ordered list: 순서가 있는 list로 자동으로 번호가 매겨짐 태그 내에서 목록의 개수만큼 태그를 작성하여 나열 출력: unordered list: 순서가 없는 list 출력: type이라는 속성을 이용해서 list가 정렬되는 타입을 바꿀 수 있음 square: 검은색 사각형 disc: 검은색 사각형 circle: 흰색 원 출력: 태그 description list 태그 내부에 description term 과 description-description 태그를 작성해 부제목-리스트를 작성 출력: 위처럼 계층적인 표시가 가능함 태그 행 row → 행 row → 열 column ↓ 열 column ↓ 에 border 속성을 작성하면 숫자만큼 굵이를 가진 border가 작성됨 태그 사이에 tab.. 2021. 6. 12. 이전 1 2 3 4 ··· 11 다음
