<!DOCTYPE html>
<head>
<style>
body{
background-image: url(img/bg.jpeg); /*투명도 주고싶음*/
background-size: cover;
background-attachment: fixed;
}
.headline{
text-align: center;
}
#dia {
width: 600px;
border-radius: 50%;
border-style: groove;
margin: 100px 0 0 0;
}
h1{
color:black;
background-color: mintcream;
font-style: italic;
font-size:100px;
margin: 0 0 100px 0;
}
.good{
width: 1000px;
background-color: mistyrose;
border-top: 20px solid mintcream;
padding: 20px;
}
#happy {
width: 400px;
}
h2{
background-color: mistyrose
}
.contents{
background-color: white;
display: flex;
}
.first{
height: 270px;
width: 450px;
border-radius: 20%;
}
.second{
height: 270px;
width: 450px;
border-radius: 20%;
}
.third{
height: 270px;
width: 450px;
border-radius: 20%;
}
.number1{
margin: 50px;
}
.number2{
margin: 50px;
}
.number3{
margin: 50px;
}
p{
line-height: 1.5em;
width: 450px;
}
</style>
</head>
<body>
<div class="headline">
<img id ="dia" src="img/img1.jpeg"/>
<h1>Diamond</h1>
</div>
<div class="good">
<img id="happy" src="img/4c.jpeg"/>
<h2>What Is Good Diamond?</h2>
<p>he 4 C’s are namely the ‘Cut’ of a diamond; ‘Color’ or rather the lack of it; ‘Clarity’ of the stone; and the size of the diamond represented in ‘Carat Weight’. The inception of the 4 C’s signifies two crucial aspects: availability of a common language to communicate diverse features of a diamond, and convenience of a standardized guideline for diamond buyers to understand precisely what they are buying.
</p>
</div>
<h2>Famous Diamonds In The World</h2>
<section class="contents">
<article class ="number1">
<img class = "first" src="img/The-Great-Star-of-Africa.jpeg"/>
<h3>1. The Great Star of Africa</h3>
<p>Here comes The Great star of Africa. It comes as Number 1 in our Top 10 Famous Diamonds list. With its 530.20 Carats – the Cullinan I or Star Africa diamond is the largest cut diamond in the World. The Cullinan was discovered in Transvaal, South Africa in l095 on an analysis tour of the Premier Mine. The Cullinan was cut by Joseph Asscher and Company of Amsterdam, who tested the enormous crystal for around six months before determining how to divide it. It eventually yielded nine major and 96 smaller vivid cut stones. When the Cullinan was first discovered, certain signs suggested that it may have been part of a much bigger crystal. But no discovery of the “missing half” has ever been authenticated.</p>
</article>
<article class ="number2">
<img class="second" src="img/The-Orloff.jpeg"/>
<h3>The Orloff</h3>
<p>It was 300 Carats when found; color: a little bluish-green; clarity: exceptionally pure; cut: Mogul-cut rose; source: India. It stands 2nd in our Top 10 Famous Diamonds list. There are so many historical episodes involving the Orloff. First, it may have been once chosen as the diamond eye of Vishnu’s idol (one of the Hindu Gods) in the deepest sanctuary temple in Srirangam, before being stolen in the 1700s by a French deserter. However, the deserter just burrows one eye from its socket, because he was terror-stricken at the thought of retribution, so he couldn’t take the other. He went to Madras and sold the stone immediately to an English sea-captain for 2,000 pounds.</p>
</article>
<article class ="number3">
<img class="third" src="img/tiffany-diamond.jpeg"/>
<h3>The Tiffany Yellow Diamond</h3>
<p>In the late 19th century,”King of Diamonds” Charles Lewis Tiffany — founder of famed jewelry retailer Tiffany & Co. — purchased a 287-carat yellow diamond discovered in the Kimberely Mine in South Africa in 1877. The stoned was the largest yellow diamond ever mined, and was fashioned by gemologist George Kunz into a cushion-cut brilliant of 128 carats. Kunz gave it a total of 90 facets: 48 on the pavilion, 40 on the crown, plus the table and culet. Breakfast at Tiffany’s fans may recognize the stone from promotional photos for the film — actress Audrey Hepburn wore it as part of the Jean Schlumberger-designer Ribbon Rosette necklace. Schlumberger worked with the stone again years later, when he mounted it to create a whimsical “Bird on a Rock” brooch for the jewelry designer’s career retrospective at the Musée des Arts Décoratifs in Paris. In 2012, the stones were reset once again into a diamond and platinum necklace to commemorate the 175th anniversary of Tiffany & Co.. Today, the exquisite diamond is on view in the brand’s New York City flagship store.</p>
</article>
</section>
</body>
</html>
정리 후
<!DOCTYPE html>
<head>
<style>
body {
background-image: url(img/bg.jpeg);
background-size: cover;
background-attachment: fixed;
}
.headline {
text-align: center;
margin: 100px 0;
}
.headline .dia {
width: 600px;
border-radius: 80px;
border-style: groove;
}
.headline h1 {
color:black;
background-color: mintcream;
font-style: italic;
font-size:100px;
}
.good {
width: 600px;
text-align: center;
margin: 100px auto;
background-color: mistyrose;
border-top: 20px solid mintcream;
padding: 40px;
}
.good .happy {
width: 400px;
}
.contents{
background-color: white;
padding: 60px 0;
}
.contents h2{
text-align: center;
}
.grid {
display: flex;
justify-content: center;
}
.grid-item {
margin: 50px;
}
.grid-cover {
width: 450px;
height: 270px;
border-radius: 40px;
}
.grid-item p {
line-height: 1.5em;
width: 450px;
}
</style>
</head>
<body>
<header class="headline">
<img class ="dia" src="img/img1.jpeg"/>
<h1>Diamond</h1>
</header>
<div class="good">
<img class="happy" src="img/4c.jpeg"/>
<h2>What Is Good Diamond?</h2>
<p>he 4 C’s are namely the ‘Cut’ of a diamond; ‘Color’ or rather the lack of it; ‘Clarity’ of the stone; and the size of the diamond represented in ‘Carat Weight’. The inception of the 4 C’s signifies two crucial aspects: availability of a common language to communicate diverse features of a diamond, and convenience of a standardized guideline for diamond buyers to understand precisely what they are buying.
</p>
</div>
<section class="contents">
<h2>Famous Diamonds In The World</h2>
<div class ="grid">
<article class="grid-item">
<img class = "grid-cover" src="img/The-Great-Star-of-Africa.jpeg"/>
<h3>1. The Great Star of Africa</h3>
<p>Here comes The Great star of Africa. It comes as Number 1 in our Top 10 Famous Diamonds list. With its 530.20 Carats – the Cullinan I or Star Africa diamond is the largest cut diamond in the World. The Cullinan was discovered in Transvaal, South Africa in l095 on an analysis tour of the Premier Mine. The Cullinan was cut by Joseph Asscher and Company of Amsterdam, who tested the enormous crystal for around six months before determining how to divide it. It eventually yielded nine major and 96 smaller vivid cut stones. When the Cullinan was first discovered, certain signs suggested that it may have been part of a much bigger crystal. But no discovery of the “missing half” has ever been authenticated.</p>
</article>
<article class ="grid-item">
<img class="grid-cover" src="img/The-Orloff.jpeg"/>
<h3>The Orloff</h3>
<p>It was 300 Carats when found; color: a little bluish-green; clarity: exceptionally pure; cut: Mogul-cut rose; source: India. It stands 2nd in our Top 10 Famous Diamonds list. There are so many historical episodes involving the Orloff. First, it may have been once chosen as the diamond eye of Vishnu’s idol (one of the Hindu Gods) in the deepest sanctuary temple in Srirangam, before being stolen in the 1700s by a French deserter. However, the deserter just burrows one eye from its socket, because he was terror-stricken at the thought of retribution, so he couldn’t take the other. He went to Madras and sold the stone immediately to an English sea-captain for 2,000 pounds.</p>
</article>
<article class ="grid-item">
<img class="grid-cover" src="img/tiffany-diamond.jpeg"/>
<h3>The Tiffany Yellow Diamond</h3>
<p>In the late 19th century,”King of Diamonds” Charles Lewis Tiffany — founder of famed jewelry retailer Tiffany & Co. — purchased a 287-carat yellow diamond discovered in the Kimberely Mine in South Africa in 1877. The stoned was the largest yellow diamond ever mined, and was fashioned by gemologist George Kunz into a cushion-cut brilliant of 128 carats. Kunz gave it a total of 90 facets: 48 on the pavilion, 40 on the crown, plus the table and culet. Breakfast at Tiffany’s fans may recognize the stone from promotional photos for the film — actress Audrey Hepburn wore it as part of the Jean Schlumberger-designer Ribbon Rosette necklace. Schlumberger worked with the stone again years later, when he mounted it to create a whimsical “Bird on a Rock” brooch for the jewelry designer’s career retrospective at the Musée des Arts Décoratifs in Paris. In 2012, the stones were reset once again into a diamond and platinum necklace to commemorate the 175th anniversary of Tiffany & Co.. Today, the exquisite diamond is on view in the brand’s New York City flagship store.</p>
</article>
</div>
</section>
</body>
</html>
css에서는 class로 묶는다.
부모요소와 자식요소를 잘 만들어줘야한다.
'Front-end > HTML CSS' 카테고리의 다른 글
박스모 활용(글자간 간격) (0) | 2022.03.30 |
---|---|
CSS 시작순서(css resets) (0) | 2022.03.29 |
Inheritance 상속, Initial Value 초기값Tag, (0) | 2022.03.28 |
CSS- 이미지 하단 간격 없애기 (0) | 2022.03.28 |
*CSS 기초 (0) | 2022.03.26 |