[모각코 23-1] 2회차- HTML/CSS 기초 궁금증 정리

목차

HTML

<strong> 과 <b>

<em> 과 <i>

<a> 태그의 속성

 

CSS

list-style-position 속성

 

margin 속성 순서

---

HTML

 

▶ <strong> 과 <b> 

화면 상에선 둘 다 굵게 표시 된다.

하지만 <strong> 는 실제로 페이지 내의 중요한 부분으로 브라우저에게 알려주어, screen reader 가 화면을 낭독할 때, 강조하여 읽는 효과를 준다.

 

 

▶  <em> 과 <i>

화면 상에선 둘다 이탤릭체로 표시된다.

하지만 <em> 은 <strong> 태그와 마찬가지로, 브라우저에게 페이지 내의 중요한 부분임을 알려주고, 스크린 리더에게도 영향을 준다.

 

 

▶  <a> 태그의 속성

_blank	링크된 문서를 새로운 윈도우나 탭(tab)에서 오픈함. (내가 조아하는거)
_self	링크된 문서를 링크가 위치한 현재 프레임에서 오픈함. 기본값으로 생략 가능.
_parent	링크된 문서를 현재 프레임의 부모 프레임에서 오픈함.
_top	링크된 문서를 현재 윈도우 전체에서 오픈함.
프레임 이름	링크된 문서를 명시된 프레임에서 오픈함.

 

 

---

CSS

 

▶  list-style-position 속성

불릿이나 번호를 들여쓰거나 내어쓸 수 있다. 기본값은 내어쓰는 outside

list-style-position: inside

**

body {
  text-align: center;
} 

설정을 해도,

불릿이나 번호는 align 대상이 아니다. 

따라서 불릿이나 번호까지 center align 된 것 처럼 보이게 하기 위해서는 list-style-position: inside 속성을 주어야 한다.

 

 

▶ margin 속성 순서

 

1. 전부 다 쓸 땐 : top-right-bottom-left(기본)

margin: [margin-top] [margin-right] [margin-bottom] [margin-left];

2. 두개만 쓸 땐 : 위아래-좌우

margin: [margin-top&margin-bottom] [margin-left & margin-right];

3. 세개 쓸 땐 : 위-좌우-아래
margin: [margin-top] [margin-left & margin-right] [margin-bottom];
4. 하나 쓸 땐 : 퉁~
margin: [margin-top & margin-bottom & margin-left & margin-right];

 

* padding 도 동일하다

 

 

*

들여쓰기 되는 것들

목록태그 <dl><dt><dd>