기본 콘텐츠로 건너뛰기

CSS

선택자
자식 선택자 >
부모 선택자 <
형제 선택자 ~

글자 가로 가운데 정렬
text-align : center; // 문자 가로 중앙 정렬

글자 세로 가운데 정렬
line-height : (부모의 높이); // 문자 세로 가운데 정렬
vertical-align:middle

요소 중앙 정렬
부모
position: relative;
자식
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);

요소 가운데 정렬
margin : auto;

컨텐츠에 맞게 크기 조절
width : fit-content;

왼쪽으로 띄우기
float: left

width: 100%; // 부모 넓이의 100%
height: 100%; // 부모 높이의 100%
width: 100vw; // 현재 창 넓이의 100분의 100
height: 100vh; // 현재 창 높이의 100분의 100

문자가 박스 밖으로 못나가게 하기
word-break: break-alll;

Input 박스 선택시에 outline 없애기
input:focus {
    outline: none;
}

Input 박스 선택시 화살표 없애기
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance:
    none;
    margin: 0;
}

border까지 포함해서 크기 고정하기
box-sizing: border-box;

p.ex1 {display: none;}
p.ex2 {display: inline;}
p.ex3 {display: block;}
p.ex4 {display: inline-block;}
라벨:

이 블로그의 인기 게시물

Python Sklearn make_regression

from sklearn.datasets import make_regression import matplotlib.pyplot as plt X, y = make_regression(n_samples=250, n_features=1, noise=50, random_state=2) plt.scatter(X,y, s=2) plt.show() from sklearn.linear_model import LinearRegression from sklearn.model_selection import train_test_split # 한글 깨짐 없이 나오게 설정 from matplotlib import rcParams # 인코딩 폰트 설정 rcParams['font.family'] = 'New Gulim' rcParams['font.size'] = 10 x_train, x_test, y_train, y_test = train_test_split(X,y, test_size=.20, random_state=0) x_train.shape, x_test.shape, y_train.shape, y_test.shape # 모델 생성 model = LinearRegression() # 학습하기 model.fit(x_train, y_train) # 가중치, 편향치 구하기 model.coef_, model.intercept_ # (array([90.11061494]), 2.4224269924448585) # 결정 계수 model.score(x_train, y_train) # 0.789267454050733 # 추정 pred = model.predict(x_test) # 산점도 plt.scatter(x_test,y_test) plt.plot(x_test, pred, 'r-') plt.show() # 추정 model.predict([[3.0]]) # 학습할 때 주는 데이터의 형식을 따른다 # x의 최소값, 최대값을 계수와 절편을 사용하여 ...
더보기

Javascript on 함수

엔터키 감지하기 <input type="password" onkeypress="func(event)" /> function func(event) {      if(event.keyCode == 13) { // keyCode 13은 엔터이다           alert("엔터를 입력했습니다.");     }     if (event.tartget.value == 13) {          alert("엔터를 입력했습니다.");     } }
더보기

Grid 정렬

  .container { display : grid ; gap : 22px ; width : 1000px ; grid-template-columns : repeat ( auto-fit , 150px ); margin : auto ; justify-content : center ; } .container {      display : grid ; gap : 22px ; grid-template-columns : repeat ( auto-fit , minmax ( 250px , 1fr )); }
더보기