https://codepen.io/EONJENOG/pen/LYKWXaW
a태그
...
codepen.io
[앵커태그 a태그]
- 앵커 = 닻
- 요소를 클릭하면 원하는 경로로 이동할 수 있게 해주는 태그
- 그 요소가 url 주소이면 그것을 하이퍼링크라고 부른다.
- 기본적으로 target이라는 속성이 있고 우리는 두가지를 사용한다.
ㄴ _self(기본값) 내가 보고 있는 페이지가 바뀌면서 이동
ㄴ _blank 새 탭이 추가되면서 페이지 이동
- 기본 display는 inline
- 텍스트를 요소로 사용하면 파란색 글자와 밑줄이 기본적으로 커스텀되어 있다.
- nomarlize 처리 후 사용해야 한다.
ㄴ a{color: inherit; text-decoration: none;}
- 마우스를 올리면 말풍선을 표시할 수 있다.
ㄴ title="" → 값으로 원하는 문구를 입력하면 된다.
[inherit]
기본값으로 돌리기
[닫았던 페이지 복구하기]
- Ctrl+Shift+T
https://codepen.io/EONJENOG/pen/GRbWwOM
목록과 리스트태그 (ul,li)
...
codepen.io
[과일 목록과 리스트]
과일
- 사과
- 딸기
- 복숭아
[ul,li]
- 목록과 리스트를 구현하는 태그
- ul태그 자식으로 li태그만 사용 가능하다.
ㄴ ul태그 형으로 h태그나 div태그 생성 후 제목으로 묶어서 사용하는 경우가 많다.
- ul태그와 li태그는 항상 꼭 같이 사용해야한다.
ㄴ 어길 시 웹 표준에 어긋난다고 검사결과가 나온다.
- ul태그는 기본적으로 margin, padding 값을 가지고 있다.
- li태그는 기본적으로 list-style을 가지고 있다.
ㄴ ul,li는 작업 전 normalize 처리 후 사용해야 한다.
ㄴ ul,li {margin: 0; padding: 0; list-style: none;}
[h태그] 제목태그
- h1~h6 라는 태그가 있다.
- h1태그는 html문서 내에서 딱 한번만 사용할 수 있다.
ㄴ logo에 사용된다.
- h1태그 사용 후 꼭 h2 사용해야 하고 중간 숫자를 생략할 수 없다.
ㄴ 예시) h1태그 사용 후 바로 h3 사용불가
ㄴ h1 사용 후 h2 h3
- h1태그를 제외하곤 나머지는 게속 사용할 수 있다.
- 메뉴바 만들기
[찾아바꾸기]
1. 바꿔야 하는 영역 선택 후 복사
2. Ctrl + H 찾아바꾸기 실행
3. 찾기에 복사한 식 붙여넣기
4. 바꾸기에 원하는 식 작성
5. 한개씩 바꿀건지 한 번에 바꿀건지
(한 번에 바꾸기) → 한번에 바꾸기 클릭
(하나씩 바꾸기) →
6. 첫번째로 바뀌어야 하는 코드 영역 선택
7. 바꾸기 셀렉트 박스 클릭
8. 하나씩 바꾸기 클릭을 하거나 엔터
