선택자6 <jQuery> 선택자와 스타일(CSS) .css() .css()로 선택한 요소의 css 속성값을 가져오거나 style 속성을 추가합니다. 문법 1 .css( propertyName ) 속성값을 가져옵니다. 예를 들어 $( "h1" ).css( "color" ); 는 h1 요소의 스타일 중 color 속성의 값을 가져옵니다. 문법 2 .css( propertyName, value ) style 속성을 추가합니다. 예를 들어 $( "h1" ).css( "color", "green" ); 는 h1 요소에 style 속성을 추가하여 글자색을 녹색으로 바꿉니다. ... .grand { width: 400px; height: 400px; background-color: deepskyblue; } .parent { width: 300px; height: .. 2021. 4. 27. jQuery Selectors (DOM 요소 선택기) jQuery 선택기와 선택기를 사용하여 DOM 요소를 찾는 방법에 대해 알아 봅니다. jQuery 선택기를 사용하면 웹 페이지에서 DOM 요소를 찾을 수 있습니다. 대부분의 경우 jQuery에서 선택기 함수 $()로 시작합니다. $(selector expression, context) jQuery(selector expression, context) 선택기 표현식 매개 변수는 요소와 일치하는 패턴을 지정합니다. jQuery는 CSS 선택기 패턴과 요소를 일치시키는 자체 패턴을 사용합니다. 컨텍스트 매개 변수는 선택 사항입니다. jQuery가 일치하는 요소를 검색하기 시작하는 DOM 계층 구조의 요소를 지정합니다. jQuery에서 일반적으로 사용되는 선택기를 살펴 보겠습니다. 이름으로 요소 선택 : 가장 .. 2021. 4. 16. 필수적인 jQuery 셀렉터(Selector) 기능 기본 셀렉터 일반적인 CSS 셀렉터를 그대로 이용할 수 있다. 태그명을 기준으로 선택하거나 id, class 명으로 선택한다. $('태그명') : HTML 문서에서 해당 태그를 모두 선택 $('#id') : HTML 문서에서 해당 id가 지정된 element 선택 $('.class명') : HTML 문서에서 해당 class가 지정된 모든 element 선택 - HTML Paragraph Element Division Element Division Element - Script $(function(){ var element = $('p'); alert(element.html()); element = $('#divID'); alert(element.html()); element = $('.className'.. 2021. 4. 13. CSS로 특정 브라우저를 선택하는 방법 반응형 웹을 만들다보면 다양한 OS와 브라우저에 따라 표시되는 모습이 달라질 수 있어서 특정 OS나 브라우저를 CSS로 선택할 수 있는 방법을 정리합니다. 다양한 OS와 브라우저에 적합하게 일반적인 CSS 속성만으로는 다소 어려움이 있다. 선택자와 가상선택자 CSS로 특정 요소를 선택하는 방법 CSS 기본 문법은 선택자 { 속성1: 값1; 속성2: 값2; ... } 입니다. HTML 문서에 여러 스타일을 적용하는데 CSS로 특정 요소를 선택하는 방법에 대해서 정리합니다. blog.pages.kr CSS로 특정 요소를 선택하는 방법 가상선택자는 기본선택자 뒤에 :(콜론)을 붙인 가상 클래스, ::(콜론두개)을 붙인 가상 요소로 요소의 특정 부분을 선택합니다. blog.pages.kr 브라우저 선택자 (CS.. 2021. 1. 21. CSS로 특정 요소를 선택하는 방법 <가상선택자> CSS로 특정 요소를 선택하는 방법 CSS 기본 문법은 선택자 { 속성1: 값1; 속성2: 값2; ... } 입니다. HTML 문서에 여러 스타일을 적용하는데 CSS로 특정 요소를 선택하는 방법에 대해서 정리합니다. blog.pages.kr HTML 문서에 여러 스타일을 적용하는데 CSS로 특정 요소를 선택하는 방법에 대해서 정리합니다. 가상선택자는 기본선택자 뒤에 :(콜론)을 붙인 가상 클래스, ::(콜론두개)을 붙인 가상 요소로 요소의 특정 부분을 선택합니다. 구조 선택자 :empty로 내용이 비어있는 HTML 요소들을 선택한다. p:empty { color: red; } 태그 요소 중 내용(공백포함)이 전혀 없는 요소의 스타일을 빨간색으로 적용한다. :first-child로 첫번째 형제 요소(단일).. 2021. 1. 10. 이전 1 2 다음 728x90