본문 바로가기

css3

[CSS] 스타일 'unset' button, input 등 스타일을 적용하기 위해서 각 브라우저마다 기본으로 적용되어 있는 style을 초기화 시키고 새로운 style을 적용한다. button의 경우 아래와 같이 작업해 줘야 한다. button { border: none; background-color: #16a085; border-radius: 10px; padding: 5px 10px; } button:focus, button:active { outline: noen; } 이러한 기본 스타일을 한번에 초기화 시켜버리는 방법이 있다. button { all: unset; } 대박이다... 만약 모든 태그에 대해서 unset을 적용하고 싶다면 아래와 같이 작성하자. body > * { all: unset; } 이 이후에 추가적으로 자.. 2018. 12. 7.
[ReactJS] styled-components react 에서 CSS 를 사용하는 방법에는 몇가지가 있다.inline - style 속성 사용 (참고: https://reactjs.org/docs/dom-elements.html#style)CSS classes are generally better for performance than inline styles. (CSS class 를 사용하는 것이 일반적으로 inline styles 를 사용하는 것보다 성능이 좋다.) ?var divStyle = { color: 'white', backgroudImage: 'url(' + imgUrl + ')', WebkitTranstion: 'all', // note the capital 'W' here msTransition: 'all' // 'ms' is the.. 2018. 9. 3.
[ReactJS] add component in list 동적으로 리스트 안의 값을 추가하여 보여줘야 하는 경우가 있다. ReactJS 에서는 render() 안의 값을 동적으로 보여주기 위해서는 state 를 이용해야 한다. import React from 'react';import TmpComponent from './TmpComponent'); export default class TestClass extends React.Component { constructor(props) { super(props); this.state = {resultAjax: [],tmpState: [],checked: [] } } componentDidMount() { // Ajax 호출 ...for (..) {checked[i] = false;this.setState({res.. 2016. 12. 29.