분류 전체보기569 [HTTPS] 윈도우 서버용 무료 SSL 인증서, Let's Encrypt SSL 윈도우 서버에 설치할 수 있는 무료 SSL 인증서로는 "Let's Encrypt"를 추천합니다. Let's Encrypt는 무료, 자동화된, 그리고 개방된 인증 기관(CA)으로, 많은 웹사이트에서 SSL/TLS 인증서를 발급받아 사용하고 있습니다. Let's Encrypt 인증서를 윈도우 서버에 설치하는 방법을 간단히 안내드리겠습니다.Let's Encrypt SSL 인증서 설치 가이드 (윈도우 서버)Certbot 설치: Let's Encrypt 인증서를 자동으로 발급받고 갱신하기 위해 Certbot을 사용합니다. 윈도우용 Certbot을 설치하세요.Certbot Download (Certbot)웹서버를 선택하고, 운영체제로 "Windows"를 선택하여 다운로드 및 설치 지침을 따르세요.파워쉘 실행: .. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 26. 버스피아 산업안전교육 2024년 하반기 -12시간- 교육 정답 🐤 관련글 참고2024.07.25 - [직박구리/버스 운전] - 버스피아 안전교육 동영상 퀴즈 자동 풀기 매크로 실행 방법12시간 짜리1회2회3회4회5회6회7회8회9회10회11회12회 직박구리/버스 운전 2024. 7. 25. 버스피아 안전교육 동영상 퀴즈 자동 풀기 매크로 실행 방법 버스피아 산업안전보건교육 자동 퀴즈 풀이 매크로 사용방법1. 보내드린 압축 파일을 압축해제 합니다.2. ImageMax.exe 를 실행합니다.3. 강의 보기 해서 강의 창을 띄웁니다.4. START 클릭 합니다.5. 기존 창 크기 복구 > 확인6. 인식 대상 > 확인7. 동영상 재생 * 만약 2번째 페이지에서도 자동재생이 안되시는 경우는 파이이폭스 동영상/오디오 자동재생 속성을 허용해야합니다. 압축 파일 없으신 분은 다음 링크 참고하세요.🐤 관련글 참고2023.01.24 - [직박구리/버스 운전] - 동영상 강의 자동 수강 방법 by 매크로프로그램 직박구리/버스 운전 2024. 7. 25. [CSS] 스타일가이드에서 블록 단위 표현 웹 페이지의 스타일가이드를 만들려고 하는데, 블럭 단위로 만들어서, 필요한 부분에 레고 블록 처럼 끼워 넣어 사용하고 싶어. 그러려면 이름이 중복이 되지 말아야 할텐데, 예를 들어보자면 표도 있고, 이미지도 있고, 텍스트도 있고, 본문도 있고, 제목도 있고, 인용도 있으면서 그리고 각각에 유형들도 몇가지 있다고 치면 어떤 규칙을 가지는게 좋을까? 설명해주고, 예를 들어줘 스타일 가이드를 블록 단위로 만들어서 레고 블록처럼 재사용하려는 접근은 훌륭한 생각입니다. 이를 위해 각 블록에 고유한 이름을 부여하는 명명 규칙이 중요합니다. 다음은 명명 규칙을 제안하고, 이러한 규칙을 통해 스타일 가이드를 구성하는 방법을 설명하겠습니다.명명 규칙접두어 사용:각 블록 유형에 접두어를 사용하여 블록의 목적을 명확히 합니.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 25. [HTML] Flex, nth-child, Grid, Block, vw, vh, position 예제들 반응형 웹 페이지를 모바일 단위로 만들어서 화면이 점점 커질때 이런 단위를 한 줄에 여러개 표현 하게 되는데 그 방법을 예를 들어 알려줘 반응형 기본 레이아웃 반응형 웹 페이지를 제작할 때, CSS의 미디어 쿼리를 사용하여 화면 크기에 따라 레이아웃을 조정할 수 있습니다. 예를 들어, 모바일 화면에서는 단위가 하나씩 표시되고 화면이 커질수록 여러 개의 단위가 한 줄에 표시되도록 설정할 수 있습니다.아래는 이러한 레이아웃을 설정하는 예제입니다. Item 1 Item 2 Item 3 Item 4 Item 5 Item 6 설명기본 스타일: .container 클래스는 flex 레이아웃을 사용하여 아이템들을 배치합니다. .i.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 25. [CSS] 스타일시트 Tips 101 CSS 스타일링 101 지금 시작합니다.1. Box Model 이해하기 margin, border, padding, content를 명확히 구분.div { margin: 10px; border: 5px solid black; padding: 20px; width: 200px;}2. CSS Resets 사용하기 기본 스타일을 재설정하여 일관성 있는 디자인 유지/* reset.css */* { margin: 0; padding: 0; box-sizing: border-box;}3. Flexbox 배우기 레이아웃을 쉽게 잡기 위한 유연한 박스 모델.container { display: flex; justify-content: center; align-items: center; heig.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 25. [JavaScript] 자바스크립트 101 Tips 동적인 웹 페이지를 만드는 데 유용한 자바스크립트 팁과 예제를 아래에 101가지 제공하겠습니다. 각각의 팁은 jQuery 없이 순수 자바스크립트로 작성되었습니다.01. DOM 요소 선택 및 조작document.getElementById("myElement").innerHTML = "Hello, World!";02. 클래스 추가 및 제거document.getElementById("myElement").classList.add("newClass");document.getElementById("myElement").classList.remove("newClass");03. 이벤트 리스너 추가document.getElementById("myButton").addEventListener("click", funct.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 25. [CSS] position 속성 예제 position을 사용하는 방법에 대해서 예를 들어 설명해줘 CSS에서 position 속성은 요소의 위치를 제어하는 데 사용됩니다. 이 속성에는 여러 값이 있으며, 각 값에 따라 요소의 배치 방식이 달라집니다. 아래는 각 position 값에 대한 설명과 예제입니다. 1. static기본값입니다. 요소는 문서의 정상적인 흐름에 따라 배치됩니다. 특별한 위치 지정이 필요 없는 경우에 사용됩니다.This is a static box. 2. relative: 요소는 문서의 정상적인 흐름에 따라 배치되지만, top, right, bottom, left 속성을 사용하여 자신의 원래 위치를 기준으로 이동할 수 있습니다.This is a relative box. 3. absolute: 요소는 문서의 .. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 25. [JAVASCRIPT] 거꾸로 가는 시간 만들기 2024년 7월 31일 오전 09시까지 현재 서버 시간을 기준으로 남은 시간을 DD일 HH시 MM분 00초 남았다고 매 초 단위로 실시간 카운트를 해주고 싶어, 이런 것은 어떤 방식으로 구현할 수 있는거야? JAVASCRIPT 로도 가능해? 구현해줘 그리고, 이러한 부분이 서버 혹은 클라이언트 많은 부하를 줄 수 있나? 실시간 카운트다운을 구현하는 것은 JavaScript로 충분히 가능합니다. 이 카운트다운은 클라이언트 측에서 실행되며 서버에 부하를 주지 않기 때문에 효율적입니다. 다음은 2024년 7월 31일 오전 09시까지의 시간을 계산하고, 매 초마다 남은 시간을 업데이트하는 JavaScript 코드입니다. 코드 설명:목표 시간 설정: targetDate 변수에 2024년 7월 31.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 25. [sublimetext] 코드 정렬 애드온 sublime text 3 사용하여 asp와 웹 페이지를 만들고 있데, 인덴트 등을 정렬하고 싶어, 어떤 경우 asp의 주석 같은 경우를 만나면 들여쓰기가 깨지는 경우들도 있고 하던데, asp, html, css, js 등을 태그 정렬하는 방법을 추천해줘 Sublime Text 3에서 ASP, HTML, CSS, JS 등의 코드를 정렬하고 들여쓰기를 맞추는 방법을 아래에 설명하겠습니다.방법1: HTML-CSS-JS Prettify1. HTML-CSS-JS Prettify 설치HTML, CSS, JS 코드를 정렬하는 데 도움이 되는 패키지입니다.Preferences > Package Control > Install Package를 클릭합니다."HTML-CSS-JS Prettify"를 검색하여 설치합니다.2.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 25. 이전 1 ··· 3 4 5 6 7 8 9 ··· 57 다음