반응형

HTML 9

[HTML] HTML 활용 문제 모음 (2)

1. 아래 코드의 결과값을 구하시오.: x = 7; : x + = 3; : y = x + 5 + "xyz"'x = 7;' 이기 때문에 x 의 값은 7'x + = 3;' 은 x 의 값에 3 을 더하게된다 x 의 값이 10이된다.'y = x + 5 + "xyz"; 먼저 10 + 5 를 하고 xyz 를 붙이게 된다 그러므로 최종 결과값은 "15xyz" 2. 알맞은 css로 빈칸을 완성하시오. html 태그를 사용해서 css 스타일을 부여 : inline CSShead 파트에서 css 스타일을 부여 : document CSScss 정보가 다른 파일에 있음 : external CSS 3. 아래 코드의 결과값을 구하시오.: var a = 3;: var b = 6;: if (b>5): b = b - a;: b = b..

코딩/HTML 2024.05.29

[HTML] HTML 활용 문제들

1. 웹페이지에 라인을 그리기 위해서는 어떠한 코드를 사용해야 할까 ?canvas, getContext, moveTo, lineTo, stroke 2. 가장 알맞는 코드를 선별해서 짝을 맞추시오XML - XSDXSD 는 주로 XML 의 구조나 규칙을 만들기 위해 존재한다HTML - CSS CSS 는 주로 HTML 의 디자인적 요소를3.  id = "y" 가 "123" 를 포함 한다고 가정하고, 위 코드를 실행 할 시 x의 값을 구하시오.x= document.getElementById ("y").innerHTML x의 값은 123가 된다 왜냐하면, innerHTML 을 사용하면 결과값이 HTML 태그들을 포함 한 상태로 도출된다.만약 textContent를 사용한다면 123이 나오지만 그냥 .innerHT..

코딩/HTML 2024.05.28

[HTML] JavaScript 기초

자바 스크립트는 HTML 파일 어디에나 작성 할 수 있다.주로 head 나 body의 마지막 부분에 작성한다. HTML 파일에 직접 코딩하지 않고도 파일 경로만 확실하게 적어주면 자바 스크립트 파일을 불러올 수 있다 자바 스크립트를 이용해서 콘텐츠를 수정 할 수 있다.Click me to change the text to FrenchHi there!document.getElementById를 이용해서 ID가 French 인 항목을 Hi there! 에서 Salut! 로 변경했다. Click me to change the style of the textHello worlddocument.getElementById를 이용해서 ID가 hello 인 항목의 스타일을 변경했다.

코딩/HTML 2024.05.27

[HTML] JSON에 대해 배워보자

JSON은 JavaScript Object Notation 의 줄임말이다.대부분의 웹 어플리케이션들은 XMl 이나 JSON을 이용해서 데이터를 저장한다.JSON은 "Self-describing"이 가능하며 이해하기 쉽다.예시){ "firstName":"John", "lastName":"Smith", "domestic":true, "fee":100.5}데이터는 쉼표로 분류 가능하다데이터는 이름과 값이 한쌍이다 자바스크립트를 JSON형식으로 변환 가능하다.objJSON = JSON.stringify(obj);반대로 JSON을 자바스크립트로 변환 가능하다.obj = JSON.parse(objJSON);JSON 오브젝트를 생성하는 코드JSON: Example 1: JSON.stringify..

코딩/HTML 2024.05.24

[HTML] Event

유저가 하얀 원을 클릭하면 검정 원으로 변경, 검정 원을 클릭하면 하얀 원으로 변경images 폴더에 2개의 사진을 저장  클릭시 특정 웹사이트로 이동하는 코드Click me to visit UOW function goToUOW() {window.location.assign("http://www.uow.edu.au");} 유저가 입력한 값을 대문자로 바꾸는 기능Enter discount code:function uppercase(){ var e = document.getElementById("discountCode"); e.value = e.value.toUpperCase();} 마우스 커서를 올렸을 시 특정효과가 나타나는 기능Click MeMouse Over Me createElemt 를 이용해서 웹사..

코딩/HTML 2024.05.10

[HTML] 자바 스크립트 응용 (Form 태그,

Form validation (Form 인증)  ... form 작성 ...form 속성 중 하나인 onSubmit 을 이용해서 데이터 input을 서버에 보내기 전 확인 Email: 예시 3) 0부터 9까지의 수로 다섯자리 만들기Enter some text with pattern 1~3 자릿수, 마침표가 있어야하고 다시 1~3자릿수가 필요한 조건한자릿수보다 크거나 같은 자릿수 (*$), 그리고 소문자가 필요한 조건NSW 혹은 ACT 등 그리고 띄어쓰기 후 4자릿 수 0-9가 필요한 조건0(1-9) 혹은 1(0-2) - 20 그리고 1(0-9) 혹은 2..

코딩/HTML 2024.04.22

[HTML] Java Script 를 배워보자

onclick 사용법 onclick="alert();" Click me Click me 각 Button에 대해 클릭 했을 시 무엇이 팝업창에 뜰지 지정 가능 Hi 라는 메세지와 (1+1) 즉 숫자 2를 팝업창에 띄움 onclick="console.log();" Click me Click me console.log 코드를 이용해 크롬 콘솔창에 저장 가능 이 두개의 코드를 동시에 이용 가능 Click me Hi 를 팝업창에 띄우면서 콘솔창에 정보르 저장 가능 버튼을 클릭 했을 시 sayHi() 라는 코드를 불러옴 JavaScript 를 이용해서 값 변경 Click me to change the text to French Hi there! Id가 french여서 같은 Id 이므로 단순히 버튼을 클릭하면 Hi ..

코딩/HTML 2024.04.11

[HTML] 입문 ( li태그, ul태그, ol태그, dl태그, table태그 )

HTML 은 Hyper Text Markup Language의 약자 이다 Hello World! HTML 은 반드시 head 와 body가 있어야 한다head 와 body의 끝맺음을 빼먹지 않는것도 중요하다 은 웹사이트의 이름이된다주로 에 코드들을 적는다고 생각하면 편하다 안에 들어가는 코드들은 tag (태그) 라고 생각하면 된다  Heading tags Heading 1 Heading 2 Heading 3 Heading 6 Normal text...h1 이 가장 중요한 heading이 된다h6 은 가장 중요하지 않은 heading 이다 Paragraph tag  This is a paragraph Another paragraph yet another paragraph 글자들을 여러 방법으로 띄어쓰..

코딩/HTML 2024.04.10

[HTML] Form 을 배워보자

HTML은 유저의 input을 수집하기 위한 도구 HTML에는 수많은 Form 타입이 있음 : text field, textarea, checkboxes, radio buttons, option selection, submit buttons, ... 예를들어 유저가 submit 버튼을 누른다면 유저가 input한 데이터가 서버로 전송됨 Form - type text First name: Last name: 화면에 보여지는 이름 Form - select multiple Select day: Monday Tuesday Wednesday Thursday Friday multiple 추가 시 다중선택 가능 Form - textarea Enter your comment: Form - submit Username:..

코딩/HTML 2024.04.09
반응형