media

삼전·2023년 5월 24일

CSS

목록 보기

13/14

1.@media는 미디어 대상을 의미한다.

예) @media all

💻📲스크린은 all, screen, print, tv, projection,,, 이렇게 있다.

2.cmd창에서 ipconig 로 ip확인하여 스마트폰 및 pc에서 확인이 가능하다.

<!DOCTYPE html>
<html>
<head>
<meta  charset="UTF-8">
<title>@media쿼리: 반응형 스타일 적용</title>
<meta name="viewport" content="width=device-width, initail-scale=1" />
<style>
	ul,li{margin:0; padding:0; list-style-type:none;}
	li{
	
		border:1px solid #ddd; margin:10px; padding:10px;
		background:#eee; float:left; width: 100%;
	}
	/*ipv4주소: 192.168.0.50로 가정하면 스마트폰이나 pc로 접속해서 확인 	 			가능하다.
    */
	
	/*600px, 601px ~ 800px, 800px, 
		스크린(all, screen, print, tv, projection,,,)
	*/
	
	@media all and (min-width:320px) and (max-width:600px){
		li{
			max-width: 100%;
			background:yellow; 
		}
	}
	/*모든 스크린에 최소는 ~ 최대는 ~*/
	@media all and (min-width:601px) and (max-width:800px){
		li{
			min-width:49%;
			background:black;
			color:yellow;	
			
		}
	}
	@media all and (min-width:801px){
		li{
			max-width:31%;
			background:lightblue;
			
		}
	}
	
</style>
</head>
<body>
	<ul>
		<li>레인보우로보틱스는 이번 오토메이트 2023에서 협동로봇 ‘RB 시리즈’ 5종을 선보이고, 북미 현지 영업 대리점 모집에 총력을 기울일 계획이다
		</li>
		<li>레인보우로보틱스는 자체개발한 구동기, 엔코더, 브레이크, 제어기 등 핵심 부품을 협동로봇에 적용해 약 50% 원가율로 경쟁사 대비 가격 경쟁력에 우위가 있다는 입장이다.
		</li>
		<li>지난달 레인보우로보틱스는 미국 일리노이주 숌버그에 현지 법인을 설립하고, 협동로봇 판매 및 고객 관리 전담 조직을 갖춰가고 있다. 
		</li>
		<li>레인보우로보틱스는 북미 시장 수출용 전 제품을 국제 기준에 맞춰 설계하고, 글로벌 인증기관 티유브이슈드(TÜV SÜD)를 통해 미국 NRTL, 캐나다 CSA 인증을 획득해 북미 시장 진출을 위한 준비를 마쳤다.
		</li>
		<li>레인보우로보틱스 관계자는 “북미 수출용 전 제품의 관련 인증 획득부터 전략적 거점의 현지법인 설립 및 전담 조직 세팅을 마무리하였고, 현지 영업 대리점 모집도 계획보다 빠르게 이뤄지고 있다”라며 “이번 오토메이트 2023에서 북미 주요 거점별 영업 대리점들을 다수 확보할 것이라 기대한다”고 말했다.
		</li>
		<li>전략적 파트너십을 맺은 현지 영업 대리점들과 함께 빠른 기간 내 북미 협동로봇 시장에서의 높은 점유율을 달성할 것”이라고 덧붙였다.
		</li>
		<li>앞서 레인보우로보틱스는 미국 미시간주 폰티악에 본사를 둔 로봇자동화 솔루션 전문기업 ‘카스카라로보틱스’와의 협동로봇 영업 및 공급을 위한 대리점 계약을 맺었고, 미국 영업 대리점 2곳, 캐나다 영업 대리점 1곳 등 각 분야에서 기계 구축 및 시스템 통합(SI) 전문기업들과 전략적 파트너십을 맺었다.
		</li>
	</ul>
</body>
</html>