Home > Software design >  Adding CSS properties to JavaScript Quiz
Adding CSS properties to JavaScript Quiz

Time:02-17

So I am making a quiz, a simple one. I am currently trying to add CSS to the different lines.

const quizContainer = document.getElementById('quiz');
const resultsContainer = document.getElementById('results');
const submitButton = document.getElementById('submit');
const myQuestions = [{
  question: "What is used primarily to make the Quiz?",
  answers: {
    a: "CSS",
    b: "JavaScript",
    c: "HTML"
  },
  correctAnswer: "b"
}];

An example is adding padding or color to the question:

"What is used primarily to make the Quiz?""

Thank you :)

CodePudding user response:

You can use style property of the element to style the elements:

const quizContainer = document.getElementById('quiz');
const resultsContainer = document.getElementById('results');
const submitButton = document.getElementById('submit');

quizContainer.style.color = "color";
quizContainer.style.padding = 20; 

And can parse different styles with every question to style every question differently:

const myQuestions = [
           {
                question: {
                     title : "What is used mainly to primarily the Quiz?",
                     style : {
                        color = "color";
                        padding = 20;
                     }
                }
           }
];
  • Related