funfunweb

1. 구글에 xeicon 검색 또는 xeicon XEIcon, 문자를 그리다 XEICon은 웹사이트 제작에 최적화된 벡터 그래픽 아이콘 툴킷입니다. 여러분의 아름답고 직관적인 웹페이지 제작을 돕습니다. xpressengine.github.io 2. get started 클릭 3. 블록표시된 부분 드래그하여 copy 4. 문서에 붙여넣기 5. 필요한 아이콘 가져오기 - LIBRARY 에서 버전 선택 6. 필요한 아이콘 이름 복사하기(이름선택후 CTRL+C) 7. 문서로 돌아와서 태그 작성 후 CLASS 에 복사한 이름 붙여넣기(CTRL + V) 8. 완성화면

input 의 type 이 search 일 경우 x 모양 없애기 x모양 나오는게 싫다면? 1. input type 을 text 로 넣는다. 2. 꼭 search 로 하고 x 모양을 없애려면? 원래 나오는 x모양 대신 내가 디자인한 x모양을 넣고 싶다면? 버튼을 따로 만들고 이미지를 넣는다. 여기선 xeicon 활용함. xeicon 활용법 공부하러가기 input field 에 내용을 입력하면 x모양 나오게 하기

1. 카카오맵 카카오맵 당신을 좋은 곳으로 안내 할 지도 map.kakao.com 2. 왼쪽 상단 검색창에 장소 및 주소 입력 3. 해당 장소 클릭 - 아래 사진에서 A (2) 부분 클릭하면 3번 창이 나온다. 이후 4 클릭 4. html태그 복사 5. 소스 생성하기 6. 소스 복사 - 일반지도 7. 소스 붙여넣기 (ctrl + v) 8. 결과

1. 구글 지도 들어가기 https://www.google.co.kr/maps Google Maps Find local businesses, view maps and get driving directions in Google Maps. www.google.co.kr 2. 왼쪽 상단 검색창에 장소명이나 주소를 입력 - 성남시청 검색함 3. 아래 공유버튼 클릭 4. 지도퍼가기 클릭 5. HTML복사 클릭 6. 페이지에 삽입하기 (ctrl + v) HTML 삽입 미리보기할 수 없는 소스

배경의 색상, 이미지, 반복여부, 위치, 고정 여부를 각각 따로 기술하거나 한번에 표기할 수 있다. /*한번에*/ background:color image repeat position attachment; /*하나씩*/ background-color:값; background-image:url(경로); background-repeat:[repeat],[no-repeat],[repeat-x],[repeat-y] background-position:left top;/*기본값 = 0 0*/ background-attachment:[scroll][fixed] background-color(배경색) 색상명, hex값, rgb값, hsl 값, rgba값, hsla 값 transparent - 투명(기본값) backg..

opacity - 요소에 투명도를 부여할 수 있는 속성 opacity:0.5; 투명도는 0 ~ 1 로 표현 1에 가까워질수록 불투명 0에 가까워질수록 투명해진다.

요소의 성격을 바궈주는 속성 속성값 속성 설명 inline block 요소의 성격을 inline 요소의 성격으로 변경 - 줄바꿈 x , 규격 x block inline 요소의 성격을 block 요소의 성격으로 변경 - 줄바꿈 o, 규격 o inline-block inline 요소에게 block 특징인 규격을 줄수 있게 함. block 요소에게 inline 특징인 가로배치(줄바꿈x)할수 있게 함 none 요소를 보이지 않게 숨기고, 자리차지도 하지 않음 See the Pen display by 정은 (@luchiaChoi) on CodePen.

글자의 색상 지정하는 속성으로 색상명을 넣거나 hex 값 RGB값 HSL 값, RGBA 값, HSLA 값으로 넣을 수 있다. A 는 ALPHA 값으로 불투명도를 의미한다.

글자 또는 박스에 그림자를 주는 속성 글자에 그림자 주기 text-shadow 박스에 그림자 주기 box-shadow 기본값: none, 상속 yes, 애니메이션 yes 문법 text-shadow:x-offset y-offset blur-radius color box-shadow:x-offset y-offset blur-radius color x-offset - 그림자의 수평거리 (필수) y-offset - 그림자의 수직거리(필수) blur-radius - 흐림정도 (기본값 0) color - 그림자 색 none - 그림자 효과 없애기 x-offset 양수 입력시 오른쪽에 그림자 생김 y-offset 양수 입력시 아래쪽에 그림자 생김 그림자 중첩 속성값을 쉼표로 구분하여 여러번 작성하면 여러개의 그림자를..

대소문자 변경 속성값 속성 설명 uppercase 소문자 대문자로 lowercase 대문자 소문자로 capitalize 첫글자만 대문자로 See the Pen text-transform by 정은 (@luchiaChoi) on CodePen.