# before

22개의 포스트

[20] 04/25 자바스크립트 수업

가상요소 html에서 인식하지 않는 가상의 요소 지정한 요소의 앞,뒤로 가상요소 추가 지정한 요소를 선택(드래그) 했을때 지정한 요소의 홀수(odd), 짝수(even)에 스타일 추가

2023년 4월 25일
·
0개의 댓글
·
post-thumbnail

A로 B 만들기

A로 B 만들기

2023년 4월 2일
·
0개의 댓글
·

TIL: ::before

::before 가상 요소는 HTML 요소의 시작 태그( 등)와 그 요소에 대한 콘텐츠 사이에 삽입되는 가상의 요소입니다. 이 가상 요소는 내용(content)을 가질 수 있으며, CSS를 사용하여 스타일링할 수 있습니다.::before 가상 요소는 content 속성

2023년 3월 8일
·
0개의 댓글
·
post-thumbnail

(css) 가상요소를 이용한 이미지 테두리

::before(가상요소)는 inline 속성이미지에 들어갈 수 없으므로, 1\. div태그로 묶기 2\. a태그에 block 속성 부여하여 사용

2023년 2월 6일
·
0개의 댓글
·
post-thumbnail

[React] tab focusing: tabIndex, focus-visible

탭으로 상호작용 할 수 있는 웹을 만들자.마우스로 손을 옮기기 귀찮아서 탭을 쓴 경험이 다들 있을것이다.무선마우스를 쓴다면 배터리가 닳아서 하는 수 없이 키보드로만 컴퓨터를 써야 할 때도 분명 있었다.다른것도 시급하지만... 그래서 이부분을 먼저 리팩토링해보기로 했다.

2023년 1월 12일
·
0개의 댓글
·
post-thumbnail

Front-end 국비지원 #035일

반응형 페이지 제작 1-1 > 이번 시간에는 제플린을 사용하여 반응형 페이지를 제작한다. 제플린이란? > ### 제플린을 쓰는 이유 이미지 슬라이스 사용이 편리하다. 텍스트 선택시 폰트 정보가 다 나온다. CSS로 나오는데 필요한 부분만 셀렉해서 사용하는 것을

2022년 12월 4일
·
0개의 댓글
·
post-thumbnail

스타벅스 예제_4

웹사이트를 만들다보면 이미지나 작은 아이콘들이 디자인 시안과 완벽하게 나오지 않는 경우도 있고, 자주 사용하는 아이콘들을 매번 요청하는 것도 쉽지 않으니 몇가지 자주 사용하는 것들은 구글에서 제공하는 material icons을 사용해 코드를 통해 입력할 수 있음.가끔

2022년 10월 25일
·
0개의 댓글
·
post-thumbnail

CSS BOX 에 대해 이 시점 필히 알아두면 좋은것들

1.CSSBoxmodelwidth / height 프로퍼티2.1 max-width / max-heightmax-width , max-height css 속성은 요소의 최대 너비 / 최대 높이를 설정합니다. width 속성의 사용값이 자신의 값보다 커지는걸 방지!high

2022년 8월 18일
·
0개의 댓글
·
post-thumbnail

가상클래스와 가상요소

웹 문서를 구조를 기준으로 특정 위치에 있는 요소를 찾아 스타일을 지정할 때 사용하는 가상 클래스 선택자문서 전체에 적용문서 안에 루트(root) 요소에 스타일을 적용함HTML문서에서는 최상위요소가 <html>이므로, 전체적으로 문서 안에 똑같이 적용할 스타일이

2022년 6월 30일
·
0개의 댓글
·

요소추가

다음 메소드를 사용하면 기존 요소의 내부에 새로운 요소나 콘텐츠를 추가할 수 있다.

2022년 5월 18일
·
0개의 댓글
·
post-thumbnail

after & before

가상 요소 별도의 class를 지정하지 않아도 지정한 것처럼 요소를 선택할 수 있다. after 실제 내용 바로 뒤에서 생성되는 자식요소 before 실제 내용 바로 앞에서 생성되는 자식요소 content="" 가짜 속성으로 after와 before를 사용할

2022년 3월 6일
·
0개의 댓글
·

[HTML/CSS] 다 알고 있다고 생각했지만 간과하고 있던 것들 2

1. position 내가 만든 영역을 2차원 평면의 공간으로 할지, 3차원 공간의 영역으로 할지를 결정짓는 요소입니다. 1-1. 2차원과 3차원의 차이 ||2차원|3차원| |:---:|:---:|:---:| |부모 자식 지간에 발생하는 마진 병합 현상|O|X| |top, left, right, bottom|X|O| |자식의 높이값이 부모의 높이값에 ...

2021년 10월 25일
·
0개의 댓글
·

[스파르타코딩클럽] 실무에 바로쓰는 AI 예측/추천 - 0주차/1주차 Before

한이음 ICT와 블렌디드 러닝 검색 및 추천 시스템을 구축하기로 하면서 AI에 대한 깊이있는 이해와 직접 구현해보는 경험이 필요했다. 한이음 ICT에서 지원하는 블렌디드 러닝을 통해 스파르타 코딩클럽을 알게 되었고, 딱 필요했던 수업이 열려서

2021년 8월 23일
·
0개의 댓글
·

앞 뒤에 가상 요소

가상 요소(Pseudo-Element)란?– 가상클래스(Pseudo-Class)는,별도의 class를 지정하지 않아도 지정한 것 처럼요소를 선택할 수 있습니다.– 가상요소(Pseudo-Element)는, 가상클래스처럼 선택자(selector)에 추가되며,존재하지 않는

2021년 8월 16일
·
0개의 댓글
·

0705 - Servlet Test Form

테스트 클래스 생성 시에, src/test/java 에 생성한다JUnit 4.13.2 어노테이션 Befor / Test / After 로 생성

2021년 7월 5일
·
0개의 댓글
·
post-thumbnail

airbnb 클론코딩

airbnb를 만든 화면이다. 주된 컨텐츠 우측 상단 login_box 만들기 가운데 각 menubar의 title hover 작동 menubar의 hover 기능 && 클릭시 달력 동작 등 나머지 html 작업(사진 간격 등) 내가 완벽하게 하지 못한 작업

2021년 3월 7일
·
0개의 댓글
·
post-thumbnail

[Javascript] append, appendChild, prepend

appendChild는 DOM 메서드이므로 생성되이 있는 요소만 추가가 가능하다. 추가 노드 갯수도 1개로 제한되어 있다.let p = document.createElement('p');document.getElementById('myId').appendChild(p)

2021년 2월 28일
·
0개의 댓글
·