Frontend/HTML & CSS & JavaScript4 CSS 새로운버전? 최신 CSS 릴리스에는 웹 디자인과 개발을 향상시킬 수 있는 여러 가지 새로운 기능이 포함되어 있습니다. 다음은 그 중 일부입니다. @layer: 이 구문은 CSS 규칙을 레이어로 그룹화하고, 특정 레이어에 대한 스타일을 적용하거나, 레이어 간의 특수성을 조정할 수 있습니다1. inert: 이 전역 속성은 HTML 요소를 비활성화하고, 포커스, 스크롤, 텍스트 선택 등의 사용자 상호작용을 방지합니다1. :has: 이 상대적 선택기는 특정 자식 요소를 포함하는 부모 요소를 선택할 수 있습니다. 예를 들어, 요소를 포함하는 모든 요소를 선택하려면 div:has(span)을 사용할 수 있습니다1. subgrid: 이 값은 CSS 그리드 레이아웃에서 부모 그리드의 행과 열을 상속받는 자식 그리드를 정의할 수 있.. 2024. 2. 8. 자바스크립트로 Input받기. 파이썬에서는 간단하게 variable = input()으로 받을 수 있었다. 자바스크립트는 node.js의 모듈을 가져와서 쓴다. 더럽게 복잡하다. 하지만 배워야겠지..? 1.'readline' 모듈 가져오기 먼저, Node.js의 'readline' 모듈을 사용할 수 있도록 가져온다. const readline = require("readline"); 2.'readline' 인터페이스 생성하기 'readline' 모듈을 이용하여 입력 및 출력 스트림을 생성한다. (stdin, stdout 은 표준 입출력 말한다고함 standard약자인것 같다) const rl = readline.createInterface({ input: process.stdin, output: process.stdout }); 3... 2024. 1. 25. HTML,CSS-style 태그 선택자 적용 우선순위 선택자(Selector) 유형 기본 선택자 전체 선택자(*), 요소(tag) 선택자 클래스(class) 선택자, 아이디(id) 선택자, 속성(attr) 선택자 결합자(Combinators) 자손 결합자, 자식 결합자 위에 코드처럼 전체는 * 로 표시 요소는 h2, div, span 등 요소의 이름으로 표시 그리고 쉼표(,)를 이용해서 여러개를 한번에 묶어서 사용도 가능합니다. 클래스는 . + 클래스명 으로 표시 ex) .box id 선택자는 id 앞에 #을 붙여서 표시 자식결합자는 직속?인 하위 요소를 고를때 사용합니다. ('>') 꺾쇠 사용 .box > p 는 box 클래스의 바로 하위 요소인 p들을 선택하겠다는 의미 자손 결합자는 직속여부에 관계없이 하위 요소를 고를 때 사용합니다. (' ') 공백 .. 2023. 3. 19. HTML, CSS 웹사이트는 웹 페이지의 모음 웹 페이지는 글, 그림, 동영상 등 여러가지 정보를 담고 있으며, 링크를 통해 다른 웹 페이지로 이동이 가능함. 즉, ***링크를 통해 여러 웹 페이지를 연결한 것***이 웹 사이트 HTML - 구조(레이아웃) HTML + CSS - 표현(스타일링) HTML + CSS + JS - 동작(인터렉션) HTML? Hyper Text Markup Language Hyper Text 참조(하이퍼링크)를 통해 사용자가 한 문서에서 다른 문서로 즉시 접근할 수 있는 텍스트 Markup Language? 태그 등을 이용하여 문서나 데이터의 구조를 명시하는 언어 대표적인 예 - HTML, Markdown 공부할때 봐야하는 곳 (MDN, W3SCHOOL) HTML 기본구조 html : 문서 치.. 2023. 3. 7. 이전 1 다음
