TIL4

css

• inline 요소가 한줄에 여러개 width/height/padding/margin 안먹음
• inline-block 한줄에 여러개 width/height/padding/margin 안먹음
• block 한줄에 하나씩만 width/height/padding/margin 먹음
  div == span+display: block
  span == div+display: inline

id 속성은 unique해야한다.
5rem -> 기본 폰트5배
#xxx -> id="xxx"인 것
.a -> class="a"인 것

tailwind는 클래스를 미리 만들어 둔 것이다.

//map으로 출력하기
function App() {
  const links = [
    {
      text: "네이버",
      href: "https://www.naver.com"
    },
    {
      text: "다음",
      href: "https://www.daum.net"
    },
    {
      text: "구글",
      href: "https://www.google.com"
    },
    {
      text: "야후",
      href: "https://www.yahoo.com"
    }
  ];

  return (
    <ul>
      {links.map(({ href, text }, index) => (
        <li key={text} className="p-1">
          <Link href={href} text={text} />
        </li>
      ))}
    </ul>
  );
}

rootElement.render(<App />);