본문 바로가기

검색효과3

자바스크립트 : 검색 효과 : sort(), reverse() 자바스크립트 : 검색 효과 : sort(), reverse() 자바스크립트의 다양한 효과들 중, 검색 효과입니다. 이번에는 sort(), reverse() 메서드를 사용하여, 오름차순, 내림차순, 알파벳순 등 속성들이 다양한 방법으로 정렬되도록 작업해 보겠습니다. 1. 속성 작성하기 const cssProperty = [ { num: 1, name: "accent-color", desc: " 요소의 강조 색상을 지정합니다. " }, { num: 2, name: "align-content", desc: " 콘텐츠 사이와 콘텐츠 주위 빈 공간을 플렉스 박스'의 교차축 또는 그리드의 블록 축을 따라 배치하는 방식을 결정합니다." }, { num: 3, name: "align-items", desc: " 교차축.. 2022. 10. 18.

자바스크립트 검색 효과 : find() 자바스크립트 : 검색 효과 : find() 자바스크립트의 다양한 효과들 중, 해당하는 문자열을 찾을 수 있는 검색 효과입니다. 이번에는 find() 메서드를 사용하여 속성을 검색하고, 검색하면 해당하는 설명이 나타나도록 작업해 보겠습니다. 1. 속성 출력하기 const cssProperty = [ { name: "accent-color", desc: "특정 요소에 색상을 지정할 때 사용됩니다." }, { name: "align-content", desc: "콘텐츠 아이템의 상하관계 정렬 상태를 설정합니다." }, { name: "align-items", desc: "콘텐츠 아이템의 내부 상하관계 정렬 상태를 설정합니다." }, { name: "align-self", desc: "개별적인 콘텐츠 아이템의 .. 2022. 9. 28.

자바스크립트 검색 효과 : indexOf() 자바스크립트 : 검색 효과 : indexOf() 자바스크립트의 다양한 효과들 중, 해당하는 문자열을 찾을 수 있는 검색 효과입니다. indexOf() 메서드를 이용하여 CSS의 다양한 속성을 검색할 수 있는 웹사이트를 작업해 보도록 하겠습니다. HTML 소스 HTML로 뼈대를 먼저 잡아주었습니다. 헤더 영역에는 내비게이션 메뉴를, 메인 영역에는 검색창, 하위 목록들을 작성해 주었습니다. 아래 소스는 메인 영역의 HTML 소스로, 나머지 영역의 소스는 하단의 '원본 소스 보기' 버튼을 클릭하면 확인할 수 있습니다. indexOf()를 이용하여 검색하기 CSS 속성 검색하기 검색하기 전체 속성 갯수 : align-content : 콘텐츠 아이템의 상하관계 정렬 상태를 설정합니다. align-items : 콘.. 2022. 8. 17.

이전 1 다음

728x90

감사합니다. 🦙

JAVASCRIPT

HTML

CSS

광고 준비중

티스토리툴바