Skip to content

Instantly share code, notes, and snippets.

@uranusjr
Created June 24, 2017 04:01
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save uranusjr/4b29abd37d1a7e7fed9dd2f9da4b6a4b to your computer and use it in GitHub Desktop.
Save uranusjr/4b29abd37d1a7e7fed9dd2f9da4b6a4b to your computer and use it in GitHub Desktop.
Pokemon
* {
font-family: sans-serif;
}
h2 {
font-size: 200%;
margin-bottom: 4px;
text-align: center;
border-bottom: 1.4px solid;
padding-bottom: 8px;
}
section {
max-width: 600px;
margin: auto;
}
section + section {
margin-top: 4rem;
}
section .content {
display: flex;
margin-top: 16px;
}
section .content .picture {
flex: 0 0 25%;
align-self: center;
}
section .content p {
padding-left: 16px;
}
.picture img {
width: 100%;
}
.raichu h2 {
color: #FFCE5D;
border-bottom-color: #FFCE5D;
}
.eevee h2 {
color: #BD531E;
border-bottom-color: #BD531E;
}
<html>
<head>
<title>最Q的神奇寶貝</title>
</head>
<body>
<section class="raichu">
<h2>雷丘</h2>
<div class="content">
<div class="picture">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTKPbDNJ6cMcjJN9cKj6QgEJocK1FpOseRE5Vy6bzK8JUyjVN_z" />
</div>
<p>雷丘是兩足齧齒動物外形的寶可夢。雷丘周身皮毛為暗橙色,腹部為白色。和皮卡丘一樣,雷丘的背上有兩個褐色的條紋。長而細的黑色尾部末端有為電光型,扁平且呈黃色。它不像皮卡丘一樣有手指,取而代之的是圓乎乎的褐色小掌。黑色的小眼珠下面,兩頰上有著黃色的電氣袋。它的腳很大,是褐褐色的。其分叉的耳朵外側是褐色的,內側是黃色的,耳朵的末梢有一個捲曲的部位。</p>
</div>
</section>
<section class="eevee">
<h2>伊布</h2>
<div class="content">
<div class="picture">
<img src="https://i1.kknews.cc/large/bd80005a04a855c60f8" />
</div>
<p>伊布的外表看起來基於狐狸,全身的毛大部分为褐色。它蓬松的尾巴的尖端和頸部的绒毛呈奶油色。伊布的腿短而细,各長有三趾和粉色的爪垫。伊布有褐色的眼睛、像兔子一样的長耳朵和小小的黑鼻子。</p>
</div>
</section>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment