Etc/Frontend

2021.07.11

z.zzz 2021. 7. 11. 19:56

modify.php 

radio 버튼 값을 가져와 활용

- 주어진 프로필 이모티콘 중 하나를 선택하면 좌측 프로필이 바뀌게 함

1. onclick()에 changeProfile()함수를 호출하면서 input의 value값 전달

2. getElementById로 선택한 이미지가 나타날 부분의 src에 인자로 받은 profileNum값을 이용해서 현재 프로필 아래에 선택한 그림을 띄움

우측에서 선택한 이미지에 따라 좌측의 이미지 바뀜

 

DB값을 php에서 받아 html에서 출력하기

- 초기값으로 사용자가 저장한 프로필 이미지를 띄우기

  : src에 echo $row[2]로 이미지 값을 줄 수 있음

 

input 입력필드 비활성화

- 회원정보 중 id는 수정할 수 없도록 비활성화 시킴

<disabled 기능>

① 입력필드 비활성화

② form으로 전송해도 전송되지 않음

 

버튼에 onClick 이벤트 적용

- 취소버튼을 누르면 이전페이지로 돌아감

+ ≠ reset 버튼

 

웹폰트 사용하기

- 나눔스퀘어 적용

 


modify.css 

버튼에 마우스 오버되면 커서를 손모양으로 바뀌게 하기 

 

input 요소에 css 적용

라디오 버튼에 스타일 적용 - 기존 버튼 모양 없앰 & 선택시 사각형 테두리

 

display 속성

block 내용의 길이에 상관 없이 가로 크기가 부모 요소의 100%를 차지
inline 새로운 줄에서 시작하지 않고, 같은 라인에서 나열됨
🚨width, height, margin, float 등이 정확하게 적용안됨
inline-block block(가로세로 크기설정 가능) + inline(다른요소들과 나란히 나열됨)
width, height, margin, padding상하 지정 가능

 

'Etc > Frontend' 카테고리의 다른 글

07.13 공부일지 - Javascript 2주차  (0) 2021.07.14
07.13  (0) 2021.07.14
2021.07.07  (0) 2021.07.07
[생활코딩-React] Update  (0) 2021.03.17
[생활코딩-React] 수업소개부터 render함수까지  (0) 2021.03.13