título bonito con css in javascript

To add a beautiful title using CSS in JavaScript, first, you need to create a new style element and define the styles inside it. Then, you can select the element you want to add the styles to and set the style attribute to the styles that you have created.

Here's an example:

index.tsx
//create a new style element
const style = document.createElement('style');

//define the styles
style.innerHTML = `
  .title {
    font-size: 24px;
    color: #333;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-top: 20px;
  }
`;

//add the style element to the head of the document
document.head.appendChild(style);

//select the element you want to add the styles to
const title = document.querySelector('#title');

//set the style attribute to the styles you have created
title.setAttribute('style', 'class=title');

565 chars
25 lines

In this example, we first create a new style element and define the styles that we want to apply to our title. Then, we add the style element to the head of the document. Finally, we select the title element using the querySelector method and set the style attribute to the styles we have created using the setAttribute method.

Note: You can also add CSS styles directly to an HTML element using the style attribute like title.style.color = '#333';, but it is recommended to use the setAttribute method when adding multiple styles to an element.