본문 바로가기

Html&CSS71

0217_display #display display:block; //숨긴것을 보여줄때도 사용 display:inline; display:inline-block; // 둘이 합쳐짐 display:none; // 컨텐츠 숨길때 사용 스크린 리더기가 못읽음(so, 안읽어도 되는 요소에만 적용) >주로 스크립트 작업때 많이 사용 함 예) 탭UI에서 탭버튼에 마우스 오버하면 해당 콘텐츠 노출 예) 페이징 버튼 방법 2가지 1) ul il(블록요소) a: 세로로 배치됨 2) div a(인라인요소) : 가로로 배치됨 1)방법은 세로기 때문에 가로로 배치해 주어야 함 부모: 가운데로 배치 2020. 2. 17.
0217_1교싱 #백그라운드 어태치 background: url("jongno_logo.gif") no-repeat 600px 400px fixed; 스플라이트 기법 > 아이콘 관리하기 푠함 (예: 다음 사이트 참고) #리스트의 작은 아이콘 백그라운드에 넣어주기 #overflow #display display:block; //숨긴것을 보여줄때도 사용 display:inline; display:inline-block; // 둘이 합쳐짐 display:none; // 컨텐츠 숨길때 사용 스크린 리더기가 못읽음(so, 안읽어도 되는 요소에만 적용) >주로 스크립트 작업때 많이 사용 함 예) 탭UI에서 탭버튼에 마우스 오버하면 해당 콘텐츠 노출 예) 페이징 버튼 방법 2가지 1) ul il(블록요소) a: 세로로 배치됨 2) .. 2020. 2. 17.
0213_css_border, margin, padding border 위로 선 표현 오른쪽 선 표현 아래 선 표현 왼쪽 선 표현 선 표현 선의 두께 선의 종류 선의 색상 padding 위로 여백 50 오른쪽 여백 50 왼쪽 여백 50 상하좌우 여백 50 상하 여백50 & 좌우 여백 10 상 50 우40 하30 좌20 상 50 좌우10 하30 상하 50 좌우10 margin 여백50 위로여백50 list-style 365민원 분야별 정보 소통과 참여 background-image 배경이미지(기본값) background-repeat 반복 가로 반복 세로 반복 반복하지 않음 background-position background-attachment background 2020. 2. 13.
0212_css_font-size font-size 부모요소의 크기에 상속받지 않고 적용 부모요소의 크기에 따라 상속받아 적용 font-family 글꼴을 구분할 때는 쉼표로 적용하고 한글 폰트명을 사용할 경우, 영문 폰트 명도 같이 작성하고 , 대표 폰트와 대체 폰트로 구분하여 표현한다. '한글폰트명',영문폰트명,대표폰트명, 대체폰트명 시스템 폰트 사용시에는 대표 폰트명 생략 color 16진수 표현: #000000 10진수 표현: rgb(255,0,0) 백분율 표현: rgb(100%,0%,0%) 색상 명: red, green font-weight 폰트 굵기를 normal(100~500로 표현 폰트 굵기를 bold(600~900) 로 표현 but 폰트에 따라 값이 다름 2020. 2. 12.
0212_css_클래스(class)&선택자 (2020/03/12) 클래스 선택자 인라인스타일 요소(html)에 스타일을 직접 선언하는 방식으로 권장하지 않음 내부 스타일 head안에 스타일을 선언하는 방식 외부 스타일 css파일을 생성하고 link태그로 선언하는 방식 클래스 선택자(class) 클래스 선택자는 문서내에서 여러번 사용 가능하고 요소와 클래스명을 구분 할 때는 점(.)으로 구분하고 클래스명 앞에 오는 요소명은 생략가능하다 아이디 선택자(id) 아이디 선택자는 문서내에서 한번만 사용 가능하고 요소와 아이디명을 구분할 때는 파운드(#)로 적용하고 아이디 명 앞에 오는 요소 명은 생략 가능 하다. first-child 첫번째 자식요소 입니다. 두번째 자식요소 입니다. 세번째 자식요소 입니다. 자식선택자(>) div의 자식요소 div의 자식.. 2020. 2. 12.
0211_form 요소 : 회원가입 어렵다 http://validator.kldp.org/ The W3C Markup Validation Service 파일 업로드로 유효성 검사 주의: Windows XP SP2 의 몇몇 IE 에서는 업로드가 되지 않을수도 있습니다. 이 경우에는, W3C QA 사이트의 information page 를 참고 하십시오. 직접 입력하여 유효성 검사 validator.kldp.org Markup 검증 서비스 >유효성 검사/ all form form 요소 form form 요소 이름 비밀번호 웹디자인 웹퍼블리셔 웹프론트앤드개발 html css 과정 선택 웹디자인 웹퍼블리셔 웹프론트앤드개발 웹개발 산하부서 선택 총무과 기획예산과 자치행정과 문화과 홍보전산과 교육지원과 구매후기 확인 파일 첨부 강조 또는 중요하다를 .. 2020. 2. 11.
0211 table 태그_HTML4 table summary ="" caption /caption : 테이블 명 colgroup col width=100 col width=100 col width=100 /colgroup thead : 표 첫번째 머릿줄 tr : 줄(행) th /th (열) th /th th /th /tr /thead tfoot : 코딩할 때는 tfoot 부터 합계:th ,내용: td tr : 1줄 th /th th /th th /th /tr /tfoot tbody tr th /th :1월 취업 td /td td /td /tr tr th /th : 2월 취업 td /td td /td /tr /tbody >>scope 작업 : css 적용 >>id heades 작업 : 스크린 리더 적용 table 월별취업현황 구분 웹디자인 .. 2020. 2. 11.
0211_div 태그 _HTML4 1. 태그 :블록요소의 형태로 그룹화 시킬 수 있음 2. 태그 인라인 요소의 형태로 콘텐츠를 그룹화 시킴 div { width: 250px; margin: 50px auto; background-color: aqua } span { color: red; width: 300px; height: 50px; background-color: yellow; } span { color: red; width: 300px; height: 50px; background-color: yellow; display: inline-block } All div : 블록요소로 그룹화 --> css 공지사항 디자인과정 개강 10일 퍼블리셔 과정 개강 11일 개발 과정 개강 12일 Span : 인라인요소로 그룹화 --> css spa.. 2020. 2. 11.
0210_ 기본 태그 _Html4 #중요# * 블록요소 / 인라인 요소 구분 >>CSS, 크로스 브라우징 할때 알아야됨 * H 태그 = 제목 태그 -H1 : 회사 로고 한국은 보통 회사 로고가 H1으로 태그 되어있음 외국은 슬로건에 달기도 함 -H2 : GNB -H3 : 탬 메뉴 ##블록요소 / 인라인 요소 ## 블록요소입니다. 인라인요소입니다. # 태그 : 순서가 필요 없는 목록 # 태그 : 순서가 있는 목록 (예: 실시간 순위 , 인기 도서 등) >> 거의 쓸일 없음 # : 어떤 용어에 해당하는 설명 (예: 네이버 사전 /) >>>> ul, li 태그 많이 씀 태그 : 문단 태그 >>거의 쓸일이 없음 ( 카피라이트) 태그 : 강제로 줄 바꿈 태그 열고 닫고 없는 태그들 br태그 메타 태그 이미지 .. 2020. 2. 11.
0210_html4 vs html5 (선언문) HTML 4 선언문 HTML5선언문 2020. 2. 11.