line-height3 사이트 따라 만들기 part.2 사이트의 컨텐츠 영역 만들기 1. 컨텐츠 그룹핑 POPULAR ITEM 구성 : 좌측의 menu와 우측의 제품 정보 영역 menu는 POPULAR ITEM이라는 타이틀과 EXPEDITION와 2개의 카테고리로 이루어짐 > 전부 텍스트 제품 정보 영역은 제품 이미지와 제품명, 제품 가격이 하나의 그룹으로 4개가 정렬됨. > 이미지와 텍스트 2. 선택자를 사용하여 그룹을 지정. /*전체 컨텐츠 영역*/ /*popular item 전체*/ /*popular item 안에서 menu 부분*/ /*popular item 안에서 제품 정보 영역*/ 3. 하위의 요소들을 나눈다. title부분은 태그를 사용한다. menu의 경우 함께 정렬되기 때문에 태그를 사용한다. 1. 태그를 이용한 방법 제품 정보 영역 전체를 .. 2022. 4. 25. CSS list-style 속성 목록 스타일list-style-type 속성 list-style-image 속성list-style-position 속성list-style 속성텍스트 관련 스타일 속성 복습하기font 속성이랑 text 속성을 아직 헷갈린다. 자꾸 반대로 적어서 스타일이 적용이 안된다. 몇번 더 복습이 필요할 것 같다. 불릿 대신 이미지 넣을 때 제한이 있나? (사이즈나 용량에 대한)list-style-type 속성 - 목록의 불릿과 번호 스타일 지정하기 순서 없는 목록에 불릿 모양 바꾸기disc : ● circle : ○square : ■none : 불릿 없애기순서없는 목록에서 불릿 없애기ul { list-style-type: none; }순서 목록에서 숫자 바꾸기decimal : 1로 시작하는 십진수decimal-l.. 2022. 4. 15. CSS text style 속성 2 문단 스타일direction 속성text-align 속성text-justify 속성text -indent 속성line-height 속성text-overflow 속성text-shadow 쉼표로 값을 구분해서 여러개의 그림자를 만들 수 있다. 잘 이용하면 그라데이션 가능.문단 스타일로 텍스트 정렬하는 것 말고 white-space를 이용해 공백이랑 문장 줄 넘김 한번에 조절 할 수 있다니 특히 텍스트가 많은 article 등에 사용하면 유용할 것 같다.Q : 그림자말고 글자 자체에도 그라데이션도 넣을 수 있을까?A : https://reveur1996.tistory.com/11 CSS text style 속성텍스트 스타일 color 속성 text-decoration 속성 text-transform 속성 te.. 2022. 4. 14. 이전 1 다음
