• 회원가입
  • 로그인
  • 구글아이디로 로그인

[func] CSS - max() 함수 - 최대값 (= max함수 = 맥스함수)

목차
  1. max() 예제 - 최대값
  2. max() 정의
  3. max() 구문
  4. max() 관련 주소

 

max() 예제 - 최대값

 

<style>

input, label {

  padding: 2px;

  box-sizing: border-box;

  display: inline-block;

  width: max(40%, 200px);

  background-color: yellow;

}


form {

  margin: 4px;

  border: 1px solid black;

  padding: 4px;

}

</style>

 

 

<form>

  <label>이름 입력:</label>

  <input type="text">

</form>

 

결과보기

 

max() 정의


열거된 값 중 최대값을 기준으로 사용. 

 


 

1. 

※ 값은 수학적 표현식도 가능.

※ 각각의 값은 다른 단위 가능.

※ 계산 순서 위해 괄호 사용 가능.

 

2.

IE 제외한 주요 최신 브라우저 지원.

 

 

max() 구문

 

max(value1, value2,...)

 


[매개변수]

 

value1, value2,...

필수. 최대값을 구하기 위해 비교할 값 (또는 표현식.)

 


[반환값]

 

열거된 값 중 최대값 반환.

 

 

max() 관련 주소

 

mdn CSS max()

https://developer.mozilla.org/en-US/docs/Web/CSS/max()

 



분류 제목
selector CSS - :nth-of-type(n) 가상선택자 - 지정타입n번째 자식요소 (순서선택자,타입선택자, IE9…
selector CSS - :only-of-type 가상선택자 - 타입유일 자식요소 (= 유일타입 자식요소) [유일선택자|타…
selector CSS - :only-child 가상선택자 - 그 부모의 유일자식요소 (유일선택자, IE9)
selector CSS - :optional 가상선택자 - 선택입력요소 (= required 속성없는 요소, IE10)
selector CSS - :out-of-range 가상선택자 - 지정범위밖값 갖는 요소 선택 (=아웃어브레인지선택자, IE…
selector CSS - :read-only 가상선택자 - 읽기전용요소 (= readonly속성있는요소 = :read-on…
selector CSS - :read-write 가상선택자 - 읽고쓰기가능요소 (= readonly속성없는요소, IE13)
selector CSS - :required 가상선택자 - 필수입력요소 (= required속성있는요소, IE10)
selector CSS - :root 가상선택자 - 웹문서root요소 선택. (= 루트선택자, IE9)
selector CSS - :target 가상선택자 - 내부링크목적지요소 (= :target선택자 = 타겟선택자 = 목적지선…
selector CSS - :valid 가상선택자 - 유효요소 (= 유효값 갖는 요소 선택, IE10)
selector CSS - ::selection 가상선택자 - 사용자가 선택한 영역 (= ::selection선택자) (가상…
selector CSS - .class 클래스선택자 ★
selector CSS - .class1.class2 클래스선택자 ★★★ - 두 클래스가 (모두/함게/둘다/동시) 정의된 요…
selector CSS - .class1 .class2 클래스선택자 ★★ - class1자손 중 class2 갖는 모든 요소
flex CSS - flex 속성(I) ☆ - flex-grow, flex-shrink, flex-basis 속성 일…
flex CSS - flex-basis 속성(I) ★ - 아이템 초기 길이 (= 아이템너비 = flex-basis속성…
flex CSS - flex-grow 속성(I) ★ - 아이템 너비 증가 (= flex-grow속성 = 플렉스그로속성…
flex CSS - flex-shrink 속성(I) ★ - 동일컨테이너 안 나머지 플렉스아이템에 비해 얼마나 줄어들지…
css CSS - FADE-IN TEXT - 페이드인 텍스트 (= 서서히 사라지는 이미지 + 서서히 나타나는 글자)
14/25
목록
찾아주셔서 감사합니다. Since 2012