본문 바로가기
SMALL

프론트엔드 개발자/CSS40

css 선택자요령과 list , Background 속성 // List Tag(목록태그) 1.비순서형(사용빈도늪음) 사이트의 모든메뉴,슬라이드,나열형구조 2.순서형(가끔) 3.정의형(가끔) ** 비순서형 ( unordered list ) ul로 정의하고 li로 표현합니다. ( list item ) contents ---> 절대불가.... 컨텐츠작성영역 우동 짬뽕 홍길동 -> 절대불가 ** 순서형 ( ordered list ) ol로 정의하고 li로 표현합니다. ** 정의형 ( definition list ) dl로 정의하고 dt, dd로 표현합니다. dt : definition term 정의되는 용어 dd : definition description 용어에 대한 설명 ** 목록 기호 없애기 ul, ol -> 선언가능 li -> 선언가능 list-style-ty.. 2023. 3. 10.
Css 레이아웃 구성, Typography 폰트 구성 레이아웃 구성 Header : Logo , Menu ( Gnb , lnb ) GNb ( Global Navigation Bar)전체메뉴 lNB ( Local Navigation Bar) 서브페이지메뉴 Main : 주요 컨텐츠 Footer : 사이트정보, 연락처, 저작권, : 왼쪽정렬X : 가운데정렬O 브라우저가로폭 100% 가로크기설정후 가운데정렬 : block요소 width 결정 ---> 부모의 width값을 그대로 적용 height ---> 컨텐츠(자식) : 배경색 ---w , h + 패딩 HTML Layout Tag Header Main Footer nav section article aside 그룹요소 class name wrap wrapper container main-wrap inner-wra.. 2023. 3. 9.
block, liline 차이점 div와 span의 차이점 , 절대단위 상대단위 및 선택자 선언방법 그룹tag block 요소 -> 줄바꿈 inline 요소 -> 줄바꿈X 의미없는태그 div : 블록요소를 그룹 span : 인라인요소를 그룹 마크업 규칙 블록요소는 블록요소를 포함 할 수 있다 블록요소는 인라인요소를 포함 할 수 있다 인라인요소는 인라인요소를 포함 할 수 있다 인라인요소는 블록요소를 포함 할 수 없다 색상 16진수 #ffffff rgba(red,green,blue,alpha) 0~255 0~1 alpha : 투명도 0: 투명 1:불투명 rgba(255,0,0,0.5) 단위 절대단위 :px외에는 사용하지 않음 상대단위 :% ,em, rem, vw,vh CSS (Cascading style Sheet) HTML 문서를 디자인하기 위한 언어 1)사용방법 -head 요소안에서 style 선언 후.. 2023. 3. 9.
Css 기본문법 1.CSS - 내부스타일 > head요소안에 작성 - 외부스타일 > CSS파일로 작성하기 ex> 디자인.css 2.스타일작성법 ex> h1 { color:#ff0000; } h1 : 선택자 ( selector ) : HTML element를 지정하는 방법 color : 속성 ( property ) #ff0000 : 값 ( value ) 선택자 1) 기본선택자 - 요소선택자 (가끔사용하나 권장하지 않음) - 아이디선택자 (거의사용하지않음) - 클래스선택자 (중요) 2) 조합선택자 3) 가상요소 4) 가상클래스 HTML과 CSS주석 ( comment ) /* css주석, 자바스크립트 주석 */ id, class 네이밍 규칙 1) 영문소문자로 작성하기 2) 숫자는 사용가능하나 첫글자로 올수 없음 3) 특수문자.. 2023. 3. 9.
LIST