목록데이터 엔지니어링 정복/HTML-CSS-JavaScript-Spring-Node.js (43)
지구정복
목차 CSS 개념 DOM 돔에 대하여 셀렉터란 Inline Style HTML 태그 안에 스타일 지정 내부 스타일 시트 외부 스타일 시트 태그에 대하여 셀렉터 태그 셀렉터 클래스 셀렉터 아이디 셀렉터 유니버셜 셀렉터 그룹 셀렉터 조합자(콤비네이션) 자식 적용 후손 적용 아우 적용 아우들 적용 CSS란 Cascading Style Sheet 의 줄임말이다. html의 뼈대를 나타내는 구조표현이면 css 는 웹 페이지의 디자인, 레이아웃 등 스타일 추가하는 언어이다. 여기서 Cascading이란 수정요소를 계속 더해가는 의미이다. 예를들면 internet explorer11 버전의 네이버로 들어간다음 주소창 밑에 오른쪽 버튼으로 메뉴를 체크하고 생긴 메뉴에서 보기탭 - 스타일 - 스타일 없음 을 누르면 cs..
목차 동영상 넣기 SVG 도형 만들기 ㅁ동영상 넣기 html 문서에 비디오를 넣으려면 태그를 사용한다. 코드는 아래와 같다. 첫 번째 source를 먼저 실행하고 이게 실행이 안되면 두 번째 소스, 두 번째 소스도 실행이 안되면 Your browser~ 멘트가 띄워진다. 현재의 결과는 동영상 재생이 되지 않는다. 따라서 video 태그의 속성값 autoplay를 설정한다. 그럼 알아서 재생이 된다. (크롬에서는 autoplay가 되지 않아서 따로 설정을 해야한다.) 이제 자동재생말고 사용자가 재생을 컨트롤할 수 있게 만들어본다. controls 속성을 추가하면된다. ㅁSVG 도형만들기 svg 태그에 대한 참고자료는 여기를 참고한다. www.w3schools.com/html/html5_svg.asp HTM..
form 태그를 이용해서 검색사이트를 구현한다. 1. 네이버 검색 url을 복사한다. 브라우저는 마이크로소프트 엣지 주소를 가져왔다. search.naver.com/search.naver?sm=tab_hty.top&where=nexearch&query=covid19&oquery=%EC%BD%94%EB%B9%84%EB%93%9C19&tqi=UHCNasp0JywssuGZ6d0ssssssTG-122909 여기서 ?를 기준으로 search.naver.com/search.naver 는 처리해야될 페이지이고 sm=tab_hty.top&where=nexearch&query=covid19&oquery=%EC%BD%94%EB%B9%84%EB%93%9C19&tqi=UHCNasp0JywssuGZ6d0ssssssTG-1229..
목차 Iframes 사용법 forms 사용법 입력상자 선택상자 파일 업로드 상자 숨긴 상자 RGB 상자 날짜 상자 숫자 상자 범위 상자 전송버튼 만들기 ㅁIframes iframe은 html 안에서 다른 html을 볼 수 있게 하는 명령어이다. 기본 타입은 아래와 같다. 실행결과처럼 모바일 다음화면을 html 문서 안에서 볼 수 있게 된다. 여기서 테두리와 스크롤을 지우면 다음과 같다. 테두리와 스크롤이 사라져서 하나의 이미지처럼 보여지지만 화면에 보이는 기능들은 모두 사용가능하다. (예를들어 이미지처럼 보이지만 클릭을 하거나 검색을 바로 할 수 있다.) 속성은 frameborder="0" scrolling="no"를 추가하면 된다. -특정 url을 iframe 안에 집어넣기 iframe안에 다른 사이트..