React[003]样式
coding
npm i classnames -S
npm i styled-components -S
npm install -S prop-types
src/index.js
import React, { Component } from 'react';
import { render } from 'react-dom'
import classNames from 'classnames';
import styled from 'styled-components'
import './index.css'
const Title = styled.h1`
color:#f00
`
class App extends Component {
render() {
const style = { color: '#f00' }
return (
<div>
<Title>元素中的样式</Title>
<h1 > 元素中的样式 </h1>
<ol>
<li style={style}>使用style内敛创建</ li>
<li className='has-text-red'>使用style内敛创建</ li>
<li className={classNames('a', { 'b': true, 'c': false })}>
要动态添加不同的className,就可以使用第三方的包,比如这个li标签只用a,b没有c
</li>
</ol>
</div>
);
}
}
render(
<App />,
document.querySelector('#root')
);
src/index.css
.has-text-red {
color: #f00
}
评论列表