{"id":19318,"date":"2020-10-29T01:24:49","date_gmt":"2020-10-29T08:24:49","guid":{"rendered":"https:\/\/careerkarma.com\/blog\/?p=19318"},"modified":"2020-12-29T11:29:00","modified_gmt":"2020-12-29T19:29:00","slug":"css-bold","status":"publish","type":"post","link":"https:\/\/careerkarma.com\/blog\/css-bold\/","title":{"rendered":"CSS Bold: A Guide to Using Font-Weight"},"content":{"rendered":"\n

To create a CSS bold text effect, you must use the font-weight property. The font-weight property determines the “weight” of a font, or how bold that font appears. You can use keywords or numeric values to instruct CSS on how bold a piece of text should be.<\/em><\/p>\n\n\n\n

As developers, in going to layout a website, sometimes we want to draw attention to something. There are a number of ways we can do that. The most basic of way is to increase the font-weight<\/strong> of the text you want to highlight. This refers to making text appear in emboldened.<\/p>\n\n\n\n

In this article, we will talk about font-weight, how to set it and give an illustration of the different possible values for the property.<\/p>\n\n\n\n

CSS Bold: A Guide<\/h2>\n\n\n\n

The font-weight property sets how bold text should appear on the screen. You can use either keywords or a numeric value to instruct CSS on how bold a particular set of text should appear.<\/p>\n\n\n\n

The syntax of the CSS font-weight property is as follows:<\/p>\n\n\n\n

font-weight: weightOfFont;<\/pre><\/div>\n\n\n\n
The value of weightOfFont is the weight of the font you want to use for the element to which the style is applied.<\/p>\n\n\n\n
The font-weight property accepts a few different values, depending on the font-weight you want to set for a particular element.<\/p>\n\n\n\n
The CSS Bold Scale<\/h2>\n\n\n\n
Think of your font-family as having a scale from 100-1000 on the boldness scale. The higher the number, the bolder the font is.<\/p>\n\n\n\n
Do some research on your preferred font-family. This will let you be sure the result will be as light or as bold as you would like on your site. Some font-families don\u2019t utilize the entire scale. <\/p>\n\n\n\n
The following code illustrates how light and how dark a popular font called \u2018Arial\u2019 can get, using both numbers and keywords:<\/p>\n\n\n\n
<!DOCTYPE html>\n<html>\n <head>\n   <meta charset="utf-8">\n   <meta name="viewport" content="width=device-width">\n   <title>repl.it<\/title>\n   <style>\n     body {\n       font-family: 'Arial';\n       font-size: 3rem;\n     }\n \n     span {\n       font-size: 1.5rem;\n     }\n \n     p:nth-child(1) {\n       font-weight: normal;\n     }\n     p:nth-child(2) {\n       font-weight: bold;\n     }\n     p:nth-child(3) span {\n       font-weight: bolder;\n     }\n     p:nth-child(4) span {\n       font-weight: lighter;\n     }\n     p:nth-child(5) {\n       font-weight: 100;\n     }\n     p:nth-child(6) {\n       font-weight: 200;\n     }\n     p:nth-child(7) {\n       font-weight: 300;\n     }\n     p:nth-child(8) {\n       font-weight: 400;\n     }\n     p:nth-child(9) {\n       font-weight: 500;\n     }\n     p:nth-child(10) {\n       font-weight: 600;\n     }\n     p:nth-child(11) {\n       font-weight: 700;\n     }\n     p:nth-child(12) {\n       font-weight: 800;\n     }\n     p:nth-child(13) {\n       font-weight: 900;\n     }\n \n   <\/style>\n <\/head>\n <body>\n   <p>Hello World! <span>-- Normal<\/span><\/p>\n   <p>Hello World! <span>-- Bold<\/span><\/p>\n   <p>Hello World!\n     <span>-- Bolder\n     <br>\n     &nbsp;     \n     &nbsp;\n     &nbsp;\n     &nbsp;\n     -- child is bolder than parent\n     <\/span><\/p>\n   <p>Hello World! <span>-- Lighter \n     <br>\n     &nbsp;     \n     &nbsp;\n     &nbsp;\n     &nbsp;\n     -- child is lighter than parent\n     <\/span>\n   <\/p>\n   <p>Hello World! <span>-- 100<\/span><\/p>\n   <p>Hello World! <span>-- 200<\/span><\/p>\n   <p>Hello World! <span>-- 300<\/span><\/p>\n   <p>Hello World! <span>-- 400 'normal'<\/span><\/p>\n   <p>Hello World! <span>-- 500<\/span><\/p>\n   <p>Hello World! <span>-- 600<\/span><\/p>\n   <p>Hello World! <span>-- 700 'bold'<\/span><\/p>\n   <p>Hello World! <span>-- 800<\/span><\/p>\n   <p>Hello World! <span>-- 900<\/span><\/p>\n \n <\/body>\n<\/html><\/pre><\/div>\n\n\n\n
Lighter and Bolder: What do they actually mean? <\/h3>\n\n\n\n
The main thing that needs to be pointed out here is that lighter and bolder are not a literal translation. Bolder here doesn\u2019t mean \u201cbolder than bold\u201d.<\/p>\n\n\n\n
Bolder and lighter actually mean, in this context, how bold or how light they are in relation to their parent element. So when we make a child element bolder, they will be one relative font-weight darker than their parent \u2013 same goes for lighter.\n\n<\/p>\n\n\n\n
The relative font-weights are as follows: <\/p>\n\n\n\n
Relative font-weight<\/td>Actual font-weight<\/td><\/tr>
thin<\/td>100<\/td><\/tr>
normal<\/td>400<\/td><\/tr>
bold<\/td>700<\/td><\/tr>
heavy<\/td>900<\/td><\/tr><\/tbody><\/table>\n\n\n\n
So, we could use the font-weight: bold property to set the font-weight of a paragraph of text to 800. When a child is one relative weight bolder than their parent, it uses the table above to figure out how bold to make it.\n\n<\/p>\n\n\n\n
For example, say I have a child that has a parent with a font-weight of 400. If I set the value of the font-weight on the child to bolder, the font-weight on the child becomes 700.<\/p>\n\n\n\n
This is because the child is one relative font-weight darker than the parent. If the parent is already as dark or as light as it can go, those property values won\u2019t do anything.<\/p>\n\n\n\n
CSS Font Weight Example <\/h2>\n\n\n\n
Suppose we are designing a website for The Seattle Stamp Club, a local stamp society. The stamp society has asked us to make the About Us<\/em> heading on the About<\/em> page of their website appear in bold. This will draw the visitor’s attention to the heading.<\/p>\n\n\n\n
The stamp club has asked us to add a block of text to their website with the history of the club. This block of text should appear in the normal font-weight. Certain phrases, which the club wants to attract the viewer\u2019s attention to, should appear in bold.<\/p>\n\n\n\n
We could use the following code to create this block of text, with certain phrases emboldened:<\/p>\n\n\n\n
<html>\n\n<p>The Seattle Stamp Club, established in 2009, is a community that encourages and promotes the collection of stamps. The Club <span>welcomes all<\/span>, from beginners to experts, and hosts monthly meetings where members can show each other their stamps, discuss the latest news in stamps, and bond over their shared interests. Right now, the club has <span>250 members<\/span>.<\/p>\n\n<style>\n\nspan {\n\tfont-weight: bolder;\n}<\/pre><\/div>\n\n\n\n
Click the <\/em>\"Image button in the code editor above to see the output of our HTML\/CSS code.<\/em><\/p>\n\n\n\n
In our HTML file, we have defined a paragraph of text enclosed within <p> tags. We have also enclosed certain phrases within <span> tags, which we are going to embolden in our CSS code.<\/p>\n\n\n\n
Next, in our CSS file, we defined a style rule that sets the font style weight of every <\/a><span> tag<\/a> to bolder<\/em>. This means that the text enclosed within any <span> tag will appear bolder than the parent element.<\/p>\n\n\n\n
When we run our code, our paragraph appears with normal font-weight, and the phrases enclosed within <span> tags appear in bold. In this example, the phrases welcomes all<\/em> and 250 members<\/em> are enclosed in <span> tags.<\/p>\n\n\n\n
Bold Text CSS with Variable Fonts<\/h3>\n\n\n\n
There are some newer fonts made available to us through the latest Level of CSS Fonts. They are called variable fonts and can take any<\/em> number between 1 and 1000 as its font-weight. Browser support wasn\u2019t fully implemented until May 2020, so they are fairly new. If you\u2019d like more information about variable fonts, check out this introduction<\/a>.<\/p>\n\n\n\n
Conclusion<\/h2>\n\n\n\n
In this tutorial, we discussed the CSS font-weight property and how it affects how bold our fonts are.<\/p>\n\n\n\n
We learned that bolder and lighter means one relative font-weight away from the font-weight of the parent element. In practice, we saw a range of font-weights to see what the text looks like. You\u2019ll be a pro at styling fonts with font-weight in no time!<\/p>\n\n\n\n
To learn more about coding in CSS, read our guide on how to learn CSS<\/a>. You can read our guide on how to make bold text in HTML if you want to make your text bold without relying on CSS.<\/p>\n","protected":false},"excerpt":{"rendered":"To create a CSS bold text effect, you must use the font-weight property. The font-weight property determines the \"weight\" of a font, or how bold that font appears. You can use keywords or numeric values to instruct CSS on how bold a piece of text should be. As developers, in going to layout a website,…","protected":false},"author":77,"featured_media":19319,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[17287],"tags":[],"class_list":{"0":"post-19318","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-css"},"acf":{"post_sub_title":"","sprint_id":"","query_class":"CSS","school_sft":"","parent_sft":"","school_privacy_policy":"","has_review":null,"is_sponser_post":"","is_guest_post":""},"yoast_head":"\nCSS Bold: A Guide to Using Font-Weight | Career Karma<\/title>\n<meta name=\"description\" content=\"Font-weight describes essentially how light or bold your font is. In this tutorial, we\u2019ll take a look at the font-weight property and how the boldness of the font is described.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/careerkarma.com\/blog\/css-bold\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"CSS Bold: A Guide to Using Font-Weight\" \/>\n<meta property=\"og:description\" content=\"Font-weight describes essentially how light or bold your font is. In this tutorial, we\u2019ll take a look at the font-weight property and how the boldness of the font is described.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/careerkarma.com\/blog\/css-bold\/\" \/>\n<meta property=\"og:site_name\" content=\"Career Karma\" \/>\n<meta property=\"article:publisher\" content=\"http:\/\/facebook.com\/careerkarmaapp\" \/>\n<meta property=\"article:published_time\" content=\"2020-10-29T08:24:49+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-12-29T19:29:00+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/steve-harvey-SoZ3b8LLOdo-unsplash.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1020\" \/>\n\t<meta property=\"og:image:height\" content=\"680\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Christina Kopecky\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@career_karma\" \/>\n<meta name=\"twitter:site\" content=\"@career_karma\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Christina Kopecky\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/\"},\"author\":{\"name\":\"Christina Kopecky\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/#\\\/schema\\\/person\\\/ae0cdc4a5d198690d78482646894074e\"},\"headline\":\"CSS Bold: A Guide to Using Font-Weight\",\"datePublished\":\"2020-10-29T08:24:49+00:00\",\"dateModified\":\"2020-12-29T19:29:00+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/\"},\"wordCount\":932,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/07\\\/steve-harvey-SoZ3b8LLOdo-unsplash.jpg\",\"articleSection\":[\"CSS\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/\",\"url\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/\",\"name\":\"CSS Bold: A Guide to Using Font-Weight | Career Karma\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/07\\\/steve-harvey-SoZ3b8LLOdo-unsplash.jpg\",\"datePublished\":\"2020-10-29T08:24:49+00:00\",\"dateModified\":\"2020-12-29T19:29:00+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/#\\\/schema\\\/person\\\/ae0cdc4a5d198690d78482646894074e\"},\"description\":\"Font-weight describes essentially how light or bold your font is. In this tutorial, we\u2019ll take a look at the font-weight property and how the boldness of the font is described.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/#primaryimage\",\"url\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/07\\\/steve-harvey-SoZ3b8LLOdo-unsplash.jpg\",\"contentUrl\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/07\\\/steve-harvey-SoZ3b8LLOdo-unsplash.jpg\",\"width\":1020,\"height\":680},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css-bold\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blog\",\"item\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"CSS\",\"item\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/css\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"CSS Bold: A Guide to Using Font-Weight\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/\",\"name\":\"Career Karma\",\"description\":\"Latest Coding Bootcamp News & Career Hacks from Industry Insiders\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/#\\\/schema\\\/person\\\/ae0cdc4a5d198690d78482646894074e\",\"name\":\"Christina Kopecky\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/06\\\/image-3-150x150.jpg\",\"url\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/06\\\/image-3-150x150.jpg\",\"contentUrl\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/06\\\/image-3-150x150.jpg\",\"caption\":\"Christina Kopecky\"},\"description\":\"Christina is an experienced technical writer, covering topics as diverse as Java, SQL, Python, and web development. She earned her Master of Music in flute performance from the University of Kansas and a bachelor's degree in music with minors in French and mass communication from Southeast Missouri State. Prior to joining the Career Karma team in June 2020, Christina was a teaching assistant, team lead, and section lead at Lambda School, where she led student groups, performed code and project reviews, and debugged problems for students. Christina's technical content is featured frequently in publications like Codecademy, Repl.it, and Educative.\",\"sameAs\":[\"http:\\\/\\\/www.linkedin.com\\\/in\\\/cmvnk\"],\"url\":\"https:\\\/\\\/careerkarma.com\\\/blog\\\/author\\\/christina-kopecky\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"CSS Bold: A Guide to Using Font-Weight | Career Karma","description":"Font-weight describes essentially how light or bold your font is. In this tutorial, we\u2019ll take a look at the font-weight property and how the boldness of the font is described.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/careerkarma.com\/blog\/css-bold\/","og_locale":"en_US","og_type":"article","og_title":"CSS Bold: A Guide to Using Font-Weight","og_description":"Font-weight describes essentially how light or bold your font is. In this tutorial, we\u2019ll take a look at the font-weight property and how the boldness of the font is described.","og_url":"https:\/\/careerkarma.com\/blog\/css-bold\/","og_site_name":"Career Karma","article_publisher":"http:\/\/facebook.com\/careerkarmaapp","article_published_time":"2020-10-29T08:24:49+00:00","article_modified_time":"2020-12-29T19:29:00+00:00","og_image":[{"width":1020,"height":680,"url":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/steve-harvey-SoZ3b8LLOdo-unsplash.jpg","type":"image\/jpeg"}],"author":"Christina Kopecky","twitter_card":"summary_large_image","twitter_creator":"@career_karma","twitter_site":"@career_karma","twitter_misc":{"Written by":"Christina Kopecky","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/careerkarma.com\/blog\/css-bold\/#article","isPartOf":{"@id":"https:\/\/careerkarma.com\/blog\/css-bold\/"},"author":{"name":"Christina Kopecky","@id":"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/ae0cdc4a5d198690d78482646894074e"},"headline":"CSS Bold: A Guide to Using Font-Weight","datePublished":"2020-10-29T08:24:49+00:00","dateModified":"2020-12-29T19:29:00+00:00","mainEntityOfPage":{"@id":"https:\/\/careerkarma.com\/blog\/css-bold\/"},"wordCount":932,"commentCount":0,"image":{"@id":"https:\/\/careerkarma.com\/blog\/css-bold\/#primaryimage"},"thumbnailUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/steve-harvey-SoZ3b8LLOdo-unsplash.jpg","articleSection":["CSS"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/careerkarma.com\/blog\/css-bold\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/careerkarma.com\/blog\/css-bold\/","url":"https:\/\/careerkarma.com\/blog\/css-bold\/","name":"CSS Bold: A Guide to Using Font-Weight | Career Karma","isPartOf":{"@id":"https:\/\/careerkarma.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/careerkarma.com\/blog\/css-bold\/#primaryimage"},"image":{"@id":"https:\/\/careerkarma.com\/blog\/css-bold\/#primaryimage"},"thumbnailUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/steve-harvey-SoZ3b8LLOdo-unsplash.jpg","datePublished":"2020-10-29T08:24:49+00:00","dateModified":"2020-12-29T19:29:00+00:00","author":{"@id":"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/ae0cdc4a5d198690d78482646894074e"},"description":"Font-weight describes essentially how light or bold your font is. In this tutorial, we\u2019ll take a look at the font-weight property and how the boldness of the font is described.","breadcrumb":{"@id":"https:\/\/careerkarma.com\/blog\/css-bold\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/careerkarma.com\/blog\/css-bold\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/careerkarma.com\/blog\/css-bold\/#primaryimage","url":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/steve-harvey-SoZ3b8LLOdo-unsplash.jpg","contentUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/07\/steve-harvey-SoZ3b8LLOdo-unsplash.jpg","width":1020,"height":680},{"@type":"BreadcrumbList","@id":"https:\/\/careerkarma.com\/blog\/css-bold\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog","item":"https:\/\/careerkarma.com\/blog\/"},{"@type":"ListItem","position":2,"name":"CSS","item":"https:\/\/careerkarma.com\/blog\/css\/"},{"@type":"ListItem","position":3,"name":"CSS Bold: A Guide to Using Font-Weight"}]},{"@type":"WebSite","@id":"https:\/\/careerkarma.com\/blog\/#website","url":"https:\/\/careerkarma.com\/blog\/","name":"Career Karma","description":"Latest Coding Bootcamp News & Career Hacks from Industry Insiders","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/careerkarma.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/careerkarma.com\/blog\/#\/schema\/person\/ae0cdc4a5d198690d78482646894074e","name":"Christina Kopecky","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/06\/image-3-150x150.jpg","url":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/06\/image-3-150x150.jpg","contentUrl":"https:\/\/careerkarma.com\/blog\/wp-content\/uploads\/2020\/06\/image-3-150x150.jpg","caption":"Christina Kopecky"},"description":"Christina is an experienced technical writer, covering topics as diverse as Java, SQL, Python, and web development. She earned her Master of Music in flute performance from the University of Kansas and a bachelor's degree in music with minors in French and mass communication from Southeast Missouri State. Prior to joining the Career Karma team in June 2020, Christina was a teaching assistant, team lead, and section lead at Lambda School, where she led student groups, performed code and project reviews, and debugged problems for students. Christina's technical content is featured frequently in publications like Codecademy, Repl.it, and Educative.","sameAs":["http:\/\/www.linkedin.com\/in\/cmvnk"],"url":"https:\/\/careerkarma.com\/blog\/author\/christina-kopecky\/"}]}},"_links":{"self":[{"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/posts\/19318","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/users\/77"}],"replies":[{"embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/comments?post=19318"}],"version-history":[{"count":0,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/posts\/19318\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/media\/19319"}],"wp:attachment":[{"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/media?parent=19318"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/categories?post=19318"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/careerkarma.com\/blog\/wp-json\/wp\/v2\/tags?post=19318"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}