본문 바로가기

분류 전체보기564

nginx woff mime type error 설정 해결 방법 Unexpected character in input: 에러 nginx woff mime type error 설정 해결 방법 Unexpected character in input: 에러 2019/07/25 15:19:07 [error] 25892#24016: *313 FastCGI sent in stderr: "PHP Warning: Unexpected character in input: ' ' (ASCII=11) state=0 in C:\work\cj_003\dcms-ui\assets\fonts\glyphicons-halflings-regular.woff2 on line 100 PHP Warning: Unexpected character in input: '' (ASCII=16) state=0 in C:\work\cj_003\dcms-ui\assets\font.. 2021. 1. 14.
CSS 선택자 (selector)의 정의와 사용법 CSS를 다루는 데 있어서 가장 기초적이고 기본적이고 핵심 적인 것이 바로 CSS 선택자의 활용이죠. CSS의 선택자 문법은 다음과 같죠. 선택자 { 속성:값} /*example*/ select {position:absolute} #selector { position:absolute; } .selector { postition:absolute; } 이런 선택자는 우리가 CSS의 스타일을 적용하고 싶은 특정 대상을 제한하고 지정하는 것을 지칭하는 것이죠. 쉽게 생각하면 타깃이라고 여겨도 무방합니다. 위에서 예를 든 선택자 3종에 대해서 일단 알아보죠. 요소 선택자 (type Selector) 아무런 기호가 없이 오는 단어는 html 태그의 Element요소입니다. a, p, div, table, li, u.. 2021. 1. 13.
bootstrap4 datepicker tempusdominus style css 수정을 위한 달력 element dom class bootstrap4 datepicker tempusdominus style css 수정을 위한 달력 element dom class 부트스트랩 4에서는 기존의 datepicker가 작동하지 않는다. 그렇다고 bootstrap을 마이너그레이션을 하기도 애매하다. 부트스트랩 4에 적용이 가능한 데이트 피커는 tempusdominus가 거의 유일하다. 좀 더 커스터마이징을 하려면 필스 라이브러리인 moments.js도 건드려야 하지만, 일단은 tempusdominus가 그리는 calendar의 class와 html element 구조만 알아도 대략적인 스타일링은 가능하다. 하지만 유감스럽게도 데이터피커를 멈추고 돔을 탐색하기가 쉽지 않다. 시간이 없어서 일단 그냥 tempusdominus datepicker .. 2021. 1. 11.
css3 :not 선택자 css3를 쓰면 css2에 비해서 퍼블리셔가 원하는 결과를 얻기가 굉장히 수월하다. 예전 같으면 스크립트의 도움을 받았어야 할 일을 css만으로 처리가 가능해졌기 때문이다. display:flex, nth-child(), calc()와 더불어 :not 선택자는 정말 축복이다. 사용방법은 간단하다. :not(.foo) {color:blue} 와 같이 사용하면 .foo 클래스가 아닌 다른 엘레먼트는 모두 텍스트 컬러 색을 파란색으로 바꾸란 뜻이다. 좀 더 세분화 할 수도 있다. div:not(.foo) { color:blue} div중에서 foo클래스가 없는 div는 텍스트 컬러를 파란색으로 하라는 뜻이다. Elements뿐만 아니라 클래스, ID를 대상으로도 선언할 수 있는 것은 당연하다. .chartAr.. 2021. 1. 5.
location.href과 split()함수로 이미지 변경하기 실제로 홈페이지를 개발하게 되면, 퍼블리싱과는 별개로 개발언어가 입혀지는 경우에 한 개의 소스 페이지로 파라미터 값을 달리해서 다른 메뉴를 구성하게 되는 경우가 종종 있다. 2015.03.26 01:30 이럴 때 특정 이미지 혹은 특정 코드만 다르게 보여져야 하는 경우 개발자를 귀찮게 하기 싫으면 location.href를 이용하면 편리하다. 예시로 들 사이트는 종로구시설관리공단인데, 유지보수 의뢰로 담당부서의 전화번호를 페이지에 삽입해 달라는 의뢰가 들어왔다. 개발자들이 바쁜 관계로 개발을 거치지 않고 UI단에서만 처리한 소스이다. http://www.ijongno.co.kr/front/main/11 종로구시설관리공단 www.ijongno.co.kr 문화체육시설, 종로구민회관, 종로문화체육센터, 동무여.. 2021. 1. 4.
[웹접근성] jquery checked checkbox radio 체크 유무, 선택된 값 가져오기 제이쿼리 체크박스 개수체크 소스 웹접근성을 고려한 jQuery를 활용한 체크박스와 라디오 버튼 처리 개요 이번 포스트에서는 웹 접근성을 준수하면서 jQuery를 활용하여 라디오 버튼과 체크박스를 처리하는 방법에 대해 알아보겠습니다. 웹 접근성을 고려하면서 사용자가 오류 발생 시 알림을 받고 해당 입력 폼으로 포커스를 이동시키는 방법을 예제를 통해 살펴보겠습니다. 예제 소개 오늘은 강동구립통합도서관 회원가입 페이지에서 라디오 버튼과 체크박스를 사용한 예제를 다루겠습니다. 사용자가 약관 동의와 개인정보 처리 방침 동의를 선택할 때, jQuery를 사용하여 선택 여부와 포커스 이동을 처리하는 방법을 살펴보겠습니다. 예제 코드 설명 아래는 사용된 라디오 버튼과 체크박스의 예제 코드입니다. 통합회원 구립도서관회원 작은도서관회원 회원 약관에 동의.. 2021. 1. 3.
워터마크 일괄 삽입 / 사진 일괄 편집 프로그램 포토스케이프 [PhotoScape] 포토스케이프 사진 일괄 편집 / 워터마크 일괄 삽입 블로그를 작성하다 보면 사진은 잔뜩 찍어 왔는데, 사진에 워터마크를 삽입하기 귀찮아서 차일피일 미루는 경우가 많습니다. 저도 예전에는 포토샵에서 일일이 워터마크를 삽입했더랬지요. T_T [머리가 나쁘면 손발이 고생한다더니…ㅉ ㅉ] 그나마도 알씨에서 사진 크기를 일괄 resize를 해도 사진 촬영 정보가 손상되지 않는다는 것도 얼마 전에 알고, 사진 리사이즈 정도만 알씨로 하고, 워터마크는 역시 포토샵에서 한 땀 한 땀 장인의 숨결(?)을 불어넣으면서 삽입하다가 열폭했지요. 그러다가 검색했습니다. 포토스케이프라는 것이 있더군요!! 포토스케이프 다운로드 www.photoscape.co.kr/ps/main/download.php 포토스케이프 (PhotoSca.. 2021. 1. 2.
[javascript] 자바스크립트로 rgb 색상표 출력하기 html rgb색상 코드표 만들기 자바스크립트로 RGB 색상표 출력하기: HTML RGB 색상 코드표 만들기 서론 RGB 색상 코드는 다양한 컬러를 표현하는 데 사용되는 중요한 개념입니다. 컴퓨터는 이 코드를 이해하기 위해 옥텟(Octet) 단위로 해석하며, 이는 8비트로 이루어진 데이터 묶음을 나타냅니다. 이러한 옥텟은 실제로 우리가 흔히 알고 있는 10진수 형식인 0부터 255까지의 값을 가지게 됩니다. RGB 색상 코드의 구성 RGB 색상 코드는 세 개의 옥텟으로 구성되며, 각각은 빨강(R), 녹색(G), 파랑(B)의 색상을 나타냅니다. 각 옥텟은 0부터 255까지의 값을 가질 수 있으며, 0은 해당 색상의 최소 빛의 양을 의미하고, 255는 해당 색상의 최대 빛의 양을 의미합니다. 예를 들어, #000000은 검은색을 나타내며, .. 2021. 1. 1.
php $_SERVER (서버함수) 예제 php뿐만 아니라 웹프로그래밍을 하다보면 서버환경이나 사용자의 사용환경 정보를 서버사이드에서 수집할 필요가 있을 때가 있다. php에서도 당연히 서버환경이나 사용자환경 예컨데 접속자의 아이피주소라든지, 자바스크립트의 USER_Agent와 같은 정보들을 수집할 수 있는 함수들이 마련되어 있다. 이를 통칭해서 서버함수라 칭하고 php에서는 $_SERVER의 배열 형태로 쓸 수 있다. 사용 예제들은 다음과 같다. 실제 동작 데모페이지는 이 곳을 클릭. 2020년 공무원 봉급표 2020년 공무원 봉급표, 소방 경찰 공무원 봉급표 2021 교사 호봉표 간부 2020 직업 군인 월급, 2021년 공무원 봉급 인상률 cafe75.kr $_SERVER['DOCUMENT_ROOT'] = 사이트가 현재 위치한 서버상의 폴.. 2020. 12. 31.
1-2 블로그 어디에 만들 것인가? 1-2 블로그 어디에 만들 것인가? it강국인 대한민국에서 블로그를 만드는 것은 인터넷 홈페이지 가입하는 것만큼이나 쉽다. 하지만 전략적으로 어떤 블로그 서비스를 이용할 것인지는 상당히 깊게 고려해 봐야 할 문제다. 현재 우리나라에서 사람들이 가장 많이 이용하는 블로그 서비스는 네이버 블로그 서비스다. 그다음은 카카오의 티스토리 블로그 서비스다. 이 2개 회사의 서비스를 가장 많이 이용하지만 단지 이 2개의 회사에서만 블로그 서비스를 제공하는 것은 아니다. 카카오 다음 블로그, zum 이글루 블로그, 구글 블로거(blogger 혹은 blogspot), 그리고 뜻밖의 중앙일보 조인스 블로그 서비스, 워드프레스 닷컴에서 회원 가입 후 블로그 서비스를 이용할 수 있다. 이들 서비스는 회원 가입만으로 블로그를 .. 2020. 12. 30.
한글 문서 편집 표편집 숨은 표 만들기, 셀블록설정, 열너비늘리기 줄이기, 셀합치기, 셀나누기 단축키 한글 문서 편집 표 편집 숨은 단축키. 1. 표 만들기 단축키 (Ctrl+N, T) 컨트롤키를 누른 상태에서 순서대로 N키와 T키를 누른다. 2. 셀 블록 설정 단축키는 F5 F5 한 번을 누르면 셀 하나만, F5를 두 번 누른 뒤 움직이면 움직이는 만큼의 셀 영역을 지정. F5 세 번을 누르면 표 전체를 선택 지정. 3. 열과 행 크기 조절 단축키 Ctrl+좌우 화살표 키로 선택된 셀의 너비와 높이를 조절할 수 있다. 단, 이때 표의 크기가 변경되므로 주의할 것. 4-1. (열전체) 열 너비 조절 단축키 Alt+좌우 방향키로도 열 너비를 조절할 수 있다. 이때 표의 크기는 바뀌지 않고, 열 전체 크기만 변경된다. 4-2 (셀 한 개) 열 너비 조절 단축키 한 개의 셀만 독립적으로 너비를 조절하려면 Sh.. 2020. 12. 29.
30-1 블로그 글쓰기 - 어디에 무엇을 쓸까? 블로그를 처음 시작할 때 장래희망을 정하라고 해서 수익형 블로그가 되기로 했다면, 도대체 블로그에 어떤 글을 써야 할지 막막해진다. 수익을 쫓는 사람에게 욕심을 버리라면 어폐가 있을 것이다. 돈을 벌겠다는 마음가짐은 그 자체로 욕망이고 욕심이니까 말이다. 우리가 어렸을 때 잘 못 배운 경제관념 중의 한 가지가 있다. "최소한의 투자로 최대한의 이익" 이 말은 사실 '최소 투자 혹은 최대 이익"인데, 마치 and조건처럼 배웠다. 그러니 알게 모르게 많은 사람들이 최대한의 이익을 얻기 위해서 최소한의 투자를 해야 한다는 강박관념 같은 것을 가지고 있다. 하지만 현실에서는 결코 투자는 거의 하지 않고 이익만 최대화할 수는 없는 노릇이다. 하다못해 로또에 당첨되려고 해도 천원은 투자해야 한다. 블로그에서 수익을.. 2020. 12. 25.

티스토리툴바