코딩ㆍ개발 정보173

• [ASP, MSSQL] 쿼리 결과 분기 방법 ASP와 MSSQL을 사용하여 데이터베이스 쿼리 결과가 없을 때 "데이터 없음"이라고 알려주는 방법을 설명드리겠습니다. 아래의 단계에 따라 ASP 스크립트에서 데이터베이스 쿼리 결과가 없을 때 적절한 메시지를 사용자에게 표시할 수 있습니다. 1. ASP에서 MSSQL 데이터베이스 쿼리 실행먼저, ASP 스크립트를 사용하여 MSSQL 데이터베이스에 쿼리를 실행하고, 결과를 확인하는 기본적인 구조를 살펴보겠습니다. " rs.MoveNext LoopEnd If' 리소스 해제rs.CloseSet rs = Nothingconn.CloseSet conn = Nothing%> 설명:데이터베이스 연결: ADODB.Connection 객체를 사용하여 MSSQL 데이터베이스에 연결합니다.쿼리 실행: co.. 코딩ㆍ개발 정보/HTML 연습 2024. 8. 2.

• [CSS] Position: Relative - Absolute 다중 구성 처리 방법 스타일링을 할 때, 여러 레벨의 컨테이너와 서브 요소가 포함된 경우, 상대적(position: relative) 및 절대적(position: absolute) 위치를 설정하여 원하는 레이아웃을 만들 수 있습니다. 예시를 통해 이를 설명해보겠습니다. 우선, HTML 구조를 가정해봅시다: 내용  위의 구조를 가지고 SASS로 스타일을 잡아보겠습니다:.container { position: relative; .sub-container { position: absolute; top: 10px; // 원하는 위치 left: 10px; // 원하는 위치 .sub { position: relative; .sub-sub-c.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 31.

• 

  [SCSS] node.js 및 Sass 사용 방법 Sass 또는 Less와 같은 CSS 프리프로세서를 사용하면 코드를 모듈화하고 중첩 구조를 사용할 수 있어 코드 관리가 용이합니다 CSS 프리프로세서 중 하나인 Sass를 예시로 사용 방법 1. Sass 설치Sass는 Node.js 기반으로 설치할 수 있습니다. Node.js와 npm(Node Package Manager)이 설치되어 있어야 합니다. 설치 방법은 다음과 같습니다: 1. Node.js 설치:Node.js 공식 웹사이트에서 설치 파일을 다운로드하고 설치합니다. 2. Sass 설치:터미널을 열고 다음 명령어를 입력하여 Sass를 전역(global)으로 설치합니다.npm install -g sass2. 프로젝트 구조 설정Sass 파일을 저장할 디렉토리 구조를 설정합니다. 예시로 다음과 같은 디렉.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 29.

• 

  [CSS] DPR의 이해 DPR은 쉽게 화면 비율이다. 100%로 보면 DPR 은 1이다.125%로 보면 DPR 은 1.25 이다. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 26.

• 

  [HTML] 브라우저 최소 폭 모바일은 320px가 최소라고 하지만,PC에서 봤을때, 메뉴 등 인터페이스가 차지하고 있는 부분들이 있어서,Windows10을 기준으로        파이어폭스 450px        크롬 500px        에지@코파 452px        에지 492px이다. 예제 Item 1 Item 2 Item 3 Item 4 Item 5 Item 6 Item 7 Item 8 Item 9 코딩ㆍ개발 정보/HTML 연습 2024. 7. 26.

• [CSS] grid-template-columns의 repeat를 포함한 속성 설명 grid-template-columns에 대해서 설명해줘. repeat는 생소해 grid-template-columns 속성은 CSS Grid 레이아웃에서 그리드 컨테이너의 열(컬럼)을 정의하는 데 사용됩니다. 이 속성을 통해 각 열의 크기와 수를 지정할 수 있습니다.기본 사용법.grid-container { display: grid; grid-template-columns: 100px 200px 100px;}위 예시에서는 3개의 열을 정의하며, 각 열의 너비는 각각 100px, 200px, 100px입니다.repeat() 함수repeat() 함수는 동일한 패턴을 반복할 때 유용합니다. 이 함수를 사용하면 더 간결하게 코드를 작성할 수 있습니다..grid-container { display: gri.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 26.

• [CSS] grid-template-columns의 repeat를 포함한 속성 설명 grid-template-columns에 대해서 설명해줘. repeat는 생소해 grid-template-columns 속성은 CSS Grid 레이아웃에서 그리드 컨테이너의 열(컬럼)을 정의하는 데 사용됩니다. 이 속성을 통해 각 열의 크기와 수를 지정할 수 있습니다.기본 사용법.grid-container { display: grid; grid-template-columns: 100px 200px 100px;}위 예시에서는 3개의 열을 정의하며, 각 열의 너비는 각각 100px, 200px, 100px입니다.repeat() 함수repeat() 함수는 동일한 패턴을 반복할 때 유용합니다. 이 함수를 사용하면 더 간결하게 코드를 작성할 수 있습니다..grid-container { display: gri.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 26.

• [CSS Grid & Flex] 같은 레이아웃을 표현한 예제 grid 레이아웃이나, flex 레이아웃 모두 HTML의 의미론적 접근을 하게 되면 같은 레이아웃이 나오게 되네. GRID는 2차원 이상, Flex 일차원이 적합하다는게 맞지? 네, 맞습니다. CSS Grid와 Flexbox 모두 HTML의 의미론적 접근을 통해 웹 접근성과 유지보수성을 높일 수 있습니다. 두 레이아웃 시스템은 목적과 용도에 따라 다른데, 이를 고려하여 적절히 사용하면 됩니다.주요 차이점CSS Grid: 2차원 레이아웃(행과 열)을 다루기에 적합합니다. 전체 페이지 레이아웃이나 복잡한 레이아웃 구조를 만들 때 유용합니다.CSS Flexbox: 1차원 레이아웃(행 또는 열)을 다루기에 적합합니다. 개별적인 UI 요소의 정렬, 크기 조정 등에 유용합니다.같은 레이아웃 예제Grid 레이아웃 예.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 26.

• [CSS Flex] 레이아웃에 어울리는 태그 세트 CSS Flex 레이아웃  자체는 어떤 HTML 태그와도 잘 작동하지만, 의미론적 HTML을 유지하는 것이 웹 접근성과 유지보수성에 도움이 될 수 있는 태그 세트는 어떤 것이 있어? CSS Flexbox 레이아웃을 사용할 때도 마찬가지로 의미론적 HTML 태그를 사용하여 구조를 명확히 하고 웹 접근성과 유지보수성을 높일 수 있습니다. 다음은 CSS Flexbox를 사용하여 레이아웃을 구성할 때 적합한 HTML 태그 세트와 예시입니다.1. 네비게이션 바 Home Services Contact nav: 네비게이션 링크 그룹을 정의ul/li: 목록 항목을 구조화a: 링크 요소2. 아티클 및 섹션 Article Title Section Title Content g.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 26.

• [CSS Grid] 레이아웃에 어울리는 태그 세트 CSS Grid 레이아웃 자체는 어떤 HTML 태그와도 잘 작동하지만, 의미론적 HTML을 유지하는 것이 웹 접근성과 유지보수성에 도움이 될 수 있는 태그 세트는 어떤 것이 있어? CSS Grid 레이아웃을 사용할 때, 의미론적 HTML을 유지하면서 웹 접근성과 유지보수성을 높일 수 있는 다양한 HTML 태그 세트가 있습니다. 각 태그는 특정 의미와 용도를 가지고 있어, 콘텐츠의 구조와 의미를 명확하게 전달할 수 있습니다. 다음은 이러한 태그 세트의 예시입니다.1. 네비게이션 바 Home Services Contact  nav: 네비게이션 링크 그룹을 정의ul/li: 목록 항목을 구조화a: 링크 요소  2. 아티클 및 섹션 Article Title Section.. 코딩ㆍ개발 정보/HTML 연습 2024. 7. 26.