웹 디자인은 HTML 마크업 언어 형식으로 인터넷을 통해 전자 매체 콘텐츠 전달의 개념을 정하고 계획하고 모델로 만들어 실행하는 과정이다. 웹 디자인의 목적은 웹 사이트를 만드는 것이다.
Cross-browsing 이란? 웹표준 기술을 서로 다른 OS 상의 플랫폼에서 인터넷 브라우져를 통해 구현되는 기술을 말하며, Cross-browsing 은 모든 브라우저가 동일한 정보를 보여주는 것을 지칭합니다. chrome firefox safari opera internet [...]
웹사이트 구축하기 준비사항 사이트 기획안 도메인 호스팅 (*호스팅이 준비되지 않았을때 XAMPP 를 통해 로컬에 세팅하여 진행) 워드프레스 솔루션 설치 필수(*자주 애용하는) 플러그인 설치 Duplicate Page Easy WP SMTP KBoard [...]
웹폰트 사용시 CSS상에서 font-family 속성값 설정 팁. font-family: "폰트네임", 속성값; 속성값 예제 serif : 삐침 있는 명조계열의 글꼴 sans-serif : 삐침 없고 굵기가 일정한 고딕계열의 글꼴 monospace : 글자 [...]
멀티사이트 업로드 용량 제한 변경 방법 워드프레스를 멀티사이트로 구축하였을때 단일 사이트로 구축했을때와 비교시 업로드 용량이 1MB로 제한되어 있습니다. 이를 변경하는 방법은 "내 사이트> 네트워크관리자> 알림판"으로 이동 후 "설정>네티워크설정" 에서 [...]
워드프레스 smtp 세팅 smtp는 인터넷에서 임메일을 보낵기위해 이용되는 프로토콜로, simple mail transfer protocol 의 줄임말입니다. 기본적으로 워드프레스의 contact fomat을 통해 메일 을 수신 받을수 있지만, 간혹 안되는 경우가 [...]
배경 이미지 무한 모션 주기 워드프레스 배경에 모션을 주기위한 css 활용법. animation-iteration-count: infinite; 에서 infinite의 의미는 애니메이션이 무한 반복 하도록 선언하는것입니다. @keyframes float{ 0%, 200%{transform: translateY(0);} 50%{transform: translateY(-50px);} } [...]
CSS 세팅설정값 /*사이드메뉴폭넓이옵션*/ .sidebar_left .inner_sidebar { margin: 0px !important; } /*ul.nested_nav li { margin: 0px !important; padding: 0px !important; }*/ ul.nested_nav li.page_item_has_children.current_page_ancestor.current_page_parent a { font-weight: 600; } /*ul.nested_nav li a [...]
background CSS 커스텀 하기 45도 각 repeating-linear-gradient(패턴의 각도, 색상1,색상1 px, 색상2 10px, 색상2 20px ); .class-name or #ID-name { color: white; /*텍스트색상*/ background: repeating-linear-gradient( 45deg, /*패턴의각도좌측하단기준*/ #606dbc, /*색상1*/ #606dbc [...]
모바일 css CSS 기본 세팅값 @charset "UTF-8"; /* mobile style */ *{ -webkit-text-size-adjust:none; } body, form, div, p, h1, h2, h3, h4, h5, h6, dl, dt, dd, ul, ol, li, fieldset, th, td, input, textarea,button,select{ margin:0; padding:0; font-family:'Malgun Gothic','맑은 고딕',dotum,'돋움',sans-serif; font-weight:normal; } body{ -webkit-user-select:none; -webkit-touch-callout:none; -webkit-tap-highlight-color:rgba(0,0,0,0); } li{ list-style:none; } a{ text-decoration:none; } a[href^="tel"]{ font-style:normal; } [...]
WordPress-side-menu-custom-made (워드프레스 기본 사이트 메뉴 CSS 커스텀하기) ※ 참고이미지 아래 css 코드 수정을 통해 위의 이미지와 같게 변경가능하다. 이를 활용한다면 추가적인 커스텀에 도움이 될 것으로 생각됩니다. /*사이드메뉴공통옵션*/ ul.nested_nav li [...]