React 入门

练习 1 前往 React 入门教程

React ES6 箭头函数

练习 1 前往 React ES6 箭头函数教程

React ES6 变量

练习 1 前往 React ES6 变量教程

React ES6 数组方法

练习 1 前往 React ES6 数组方法教程

React ES6 解构

练习 1 练习 2 前往 React ES6 解构教程

React ES6 扩展

练习 1 前往 React ES6 扩展教程

React ES6 三元运算符

练习 1 前往 React ES6 三元运算教程

React JSX

练习 1 练习 2 练习 3 练习 4 前往 React JSX 教程

React 组件

练习 1 练习 2 前往 React 组件教程

React 属性

练习 1 前往 React 属性教程

React 事件

练习 1 前往 React 事件教程

React 条件

练习 1 前往 React 条件教程

React 列表

练习 1 前往 React 列表教程

React 钩子 useState

练习 1 前往 React 钩子 useState 教程

React 钩子 useEffect

练习 1 前往 React 钩子 useEffect 教程

React CSS 样式

练习 1 练习 2 练习 3 练习 4 前往 React CSS 样式教程

×

×

正确

练习:

在<h1>元素的内联样式中添加以下CSS样式

background-color = "yellow"

const Header = () => { return ( <> <h1 style={{backgroundColor: "yellow"}}>Hello Style!</h1> <p>Add a little style!</p> </> ); }

const Header = () => { return ( <> <h1 style={{backgroundColor: 'yellow'}}>Hello Style!</h1> <p>Add a little style!</p> </> ); }

const Header = () => { return ( <> <h1 style={{backgroundColor:"yellow"}}>Hello Style!</h1> <p>Add a little style!</p> </> ); }

const Header = () => { return ( <> <h1 style={{backgroundColor:'yellow'}}>Hello Style!</h1> <p>Add a little style!</p> </> ); }

不正确

点击此处重试

正确

下一题 ❯

const Header = () => {
  return (
    <>
      <h1 style=w3exercise_input_no_0
>Hello Style!</h1>
      <p>Add a little style!</p>
    </>
  );
}