Computer >> 컴퓨터 >  >> 프로그램 작성 >> CSS

CSS의 글꼴 두께

<시간/>

CSS font-weight 속성은 요소의 텍스트 문자의 굵기를 정의하는 데 사용됩니다.

구문

CSS font-weight 속성의 구문은 다음과 같습니다 -

Selector {
   font-weight: /*value*/
}

예시

다음 예는 font-weight 속성을 보여줍니다 -

<!DOCTYPE html>
<html>
<head>
<style>
div {
   margin: 3px;
   font-family: "Ink Free";
   width: 30%;
   font-size: 24px;
}
#one {
   font-weight: normal;
   border-bottom: 2px dashed greenyellow;
}
#two {
   font-family: "Kristen ITC";
   font-weight: bolder;
   border-bottom: 2px dashed cornflowerblue;
}
#three {
   font-weight: bold;
   border-bottom: 2px dashed chocolate;
}
</style>
</head>
<body>
<div id="one">First Demo Text</div>
<div id="two">Another Demo Text</div>
<div id="three">Last Demo Text</div>
</body>
</html>

출력

이것은 다음 출력을 제공합니다 -

CSS의 글꼴 두께

예시

<!DOCTYPE html>
<html>
<head>
<style>
[class|=lis] {
   font-style: italic;
   font-weight: bold;
}
li[class|="lis-ul"] {
   background-color: cadetblue;
   font-family: Helvetica;
   font-weight: 100;
   color: gainsboro;
   width: 20%;
}
</style>
</head>
<body>
<h2>Tutorials</h2>
<ol>
<li><p>C#</li>
<li class="lis-ul-2">DBMS</li>
<li class="lis-3">OS</li>
<li>Java</li>
<ul>
<li class="lis-ul-one">Core Java</li>
<li class="lis">Advance Java</li>
</ul>
</ol>
</body>
</html>

출력

이것은 다음 출력을 제공합니다 -

CSS의 글꼴 두께