🌱 오늘의 주제 : [javascript] modal 창 띄우기 🌱 [javascript] modal 창 띄우기 data-target속성, data-toggle속성 : 버튼 태그의 경우 필수 속성 data-toggle : 모달창 오픈 data-target : 모달의 id에 집중하게 함 data-target의 value : 버튼 클릭 시 모달로 띄우고자 하는 id값을 #을 붙여서 연결 data-toggle의 value : 모달기능을 수행함을 의미 data-dismiss : 모달을 닫게하는 기능 data-backdrop="static" : 배경을 클릭해도 모달이 닫히지 않게 함 모달 사이즈
🌱 오늘의 주제 : FRONT-END : 모든 padding 속성 css 🌱 FRONT-END : 모든 padding 속성 css
🌱 오늘의 주제 : HTML과 자바스크립트(Javascript) 🌱 DOM(Document Object Model)이란? W3C의 표준 객체 모델 브라우저가 HTML 웹 문서를 읽어들인 후 Tree 구조로 구성하여 메모리에 적재한다. DOM Tree를 볼 수 있는 사이트아래 HTML 문서를 복사해서 붙여넣기 Hello World! 내 이름은 OO이다. 내 이름은 ㅁㅁ이다. 마론달로 이동 🌱 자바스크립트로 각 Node 접근해보기 선택자(Selector)로 Node를 가져온다. 선택자의 종류 태그 id class 태그의 name 속성 예) 1) id로 노드 가져오기 id는 문서 안에서 하나만 사용한다. let p1 = document.getElementById('p1'); console.log(p1); 결과..
🌱 오늘의 주제 : 자바스크립트(Javascript)란? 🌱 자바스크립트(JavaScript) Java와는 완전 다른 언어이다. HTML을 동적으로 움직이게 하는 역할 서버와 서로 데이터를 전송하는 역할 일반적으로 클라이언트 언어로 사용하지만, 서버 언어로 사용되기도 한다. 🌱 자바스크립트 작성 방법 1) HTML 태그 안에서 사용 태그 안에 자바스크립트 문법으로 코드를 작성할 수 있다. 2) 외부 파일로 작성 확장자는 .js로 사용한다.
🌱 오늘의 주제 : CSS(Cascading Style Sheets)란? 🌱 CSS(Cascading Style Sheets)란? CSS(Cascading Style Sheet)는 HTML 문서의 스타일이나 레이아웃 등 디자인 서식을 작성하는 언어이다. 🌱 CSS 특성 css를 활용하면 문서의 내용과 디자인 서식이 분리되어 문서가 깔끔하고, 수정이 용이하다. HTML 처럼 텍스트 에디터에서 작성 가능 확장명은 .css 이다. css 문서의 파일 이름은 알파벳, 숫자, 하이픈(-), 밑줄(_)만을 사용해야 한다. 🌱 CSS 기본 문법 선택자 { 속성: 속성값; } 형식으로 사용 선택자(Selector)의 종류 전체: * tag 명 id 명 class 명 주석: /* 주석 내용 */ h2 태그를 꾸미는 예제..
🌱 오늘의 주제 : HTML 란? 🌱 HTML(HyperText Markup Language) 웹 표준을 주관하는 W3C에서 발표한 프로그래밍 언어로 웹 문서를 제작하는데 사용된다. 🌱 HTML 특성 HTML 문서는 태그(Tag)라고 부르는 마크업(Markup) 요소를 이용하여 문서를 구현함 메모장, 일반 에디터 등 문서 편집 프로그램으로 작성 가능함 HTML 문서의 확장명은 .htm 또는 .html 이다. 대부분 .html로 쓴다. HTML로 제작된 문서는 웹 브라우저가 해석하여 보여지게 된다. 🌱 HTML의 기본 구조 주석: 본문 🌱body 태그에서 자주 사용하는 태그 목록
🌱 오늘의 주제 : Web의 동작 방식 🌱 Web의 동작 방식 클라이언트(Client) 정보를 요청하는 곳 HTTP 프로토콜 규약에 따른 요청(Request) 문서로 정보를 요청한다. 서버(Server) 정보를 주는 곳 요청 받은 Request 문서의 내용을 기반으로 HTTP 프로토콜 규약에 따른 응답(Response) 문서를 돌려준다. Request의 구조 HTTP 규약에 따른 Request 문서의 구조 Request의 구조 HTTP 규약에 따른 Request 문서의 구조 🌱 다양한 클라이언트의 요청 클라이언트(Client)의 종류 웹 브라우저 안드로이드 Application IOS Application 🌱 서버와 데이터베이스의 통신 🌱서버의 데이터 가공을 위한 다양한 통신
🌱 오늘의 주제 : 왕초보도 할 수 있는 통나무 팬션 웹페이지 만들기(자바스크립트) 🌱 왕초보도 할 수 있는 통나무 팬션 웹페이지 만들기(자바스크립트) https://youtu.be/QCYfZ7G0J2I 🌱 jQuery 프레임워크를 이용한 기능 페이지 완성하기 bootstrap 을 활용해서 아래와 같은 화면을 구성해보세요. 메뉴 글씨에 마우스를 올리면 각 메뉴의 배경색이 변하도록 만들어 보세요. 라디오 버튼 이벤트 비회원 라디오 버튼을 선택하면 아래와같이 input 창이 변경되도록 하세요. 날짜는 datepicker 를 사용해서 날짜를 선택하게 하세요. 오늘 날짜 이후로만 선택 가능하도록 하세요. 날짜 포맷은 2025년 10월 10일 와 같은 형태로 표현하세요. 유효성 검사 조회 하기 버튼을 눌렀을 때,..
🌱 오늘의 주제 : 외부 라이브러리 연동 - prism 🌱 언어,테마 선택 1. 압축 방식 : Minfied version 선택 2. 원하는 테마 선택 3. 원하는 언어 선택 🌱 JS파일, CSS 다운로드 🌱 적용하기 다운로드 후 파일을 Visual Studio Code에 옴긴 후 파일명을 간단히 변경 아래 그림처럼 파일명을 알맞게 쓴다. (예시 : prism.css) 언어는 원하는 언어 쓰기 (예시: language-Java) 🌱 완성 코드 YURI 예제 보기 package ex01; public class Ex01 { public static void main(String[] args) { System.out.println("Hello, World!!"); } } YURIright @ marondal..
🌱 오늘의 주제 : 왕초보도 할 수 있는 간단한 쇼핑몰 페이지 만들기(자바 스크립트) 🌱 왕초보도 할 수 있는 간단한 쇼핑몰 페이지 만들기(자바 스크립트) 🌱 쇼핑몰 페이지 코드(자바 스크립트) 검색 상맨 상 남자의 패션몰 로그인 회원가입 고객센터 장바구니 Outer Top Shirt Pants Accessory Best seller 리얼 가죽 무스탕 87,000원 55,000원 [1+1]기본 버튼 반팔티 15,000원 7,000원 정장 스타일 무지 조끼 45,000원 40,000원 스키니핏 씨블루 정장 자켓 53,000원 45,000원 프리미엄 올라운드 데님셔츠 33,000원 30,000원 회사: Sangman 대표 : 김상남 주소: 서울시 종로구 아무개로 32번길 93 패션타운 806호 사업자 번호:..
