'Changing text color between 3 colors frequently within a paragraph in CSS
I have been working on a personal website and had a design that I had really liked but to effectively do this it requires the color of the text to frequently change inside of each paragraph. My current solution was to have a custom tag that would change the color of the text inside but this method makes the HTML excessively messy. Below there is a snip from the HTML that effectively shows the problem.
import SideLinks from "../components/sideLinks";
import Article from "../components/article";
export default function About() {
return (
<div className="about">
<SideLinks />
<Article>
<h1>
const <white>skills</white> = () => {
<br />
</h1>
<p>
const skills = { <br />
<p>
"
<strong>
<white>Languages</white>
</strong>
" : [ "<white>Python</white>", "<white>Javascript</white>", "
<white>HTML/Css</white>", "<white>MySQL</white>"] <br />"
<strong>
<white>General</white>
</strong>
" : ["<white>AWS</white>"] <br />"
<strong>
<white>Data-analytics</white>
</strong>
" : ["<white>Pandas</white>", "<white>Tensorflow</white>", "
<white>Tableau</white>", "<white>Statistics</white>"]
<br />"
<strong>
<white>Web-development</white>
</strong>
" : ["<white>React"</white>, "<white>Redux</white>", "
<white>Flask</white>"] <br />"
<strong>
<white>Soft-skills</white>
</strong>
" : ["<white>Problem Solving"</white>, "<white>Learning"</white>, "
<white>Communication</white>"]{" "}
</p>
}; console.log(skills);
</p>
<h1>};</h1>
</Article>
</div>
);
}
My goal is to make the text look like the image below. The code I have shown above does it as intended but I would like to find a method that is more well... realistic to use.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|

