【TechAcademy】はじめてのCSS入門：動画で使用するソースコードを用意しました！

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>CSSの練習</title>
 </head>
  <body>
  　<h1>aiueo</h1>
    　<p>
　　　　helloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworld
   　 </p>
    <h1>abcde</h1>
   　 <p>
    　　goodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworld
   　 </p>
    <h1>12345</h1>
   　 <p>
   　　 gdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymate
    　</p>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

<!doctype html>

<head>

<title>CSSの練習</title>

</head>

<body>

　<h1>aiueo</h1>

　<p>

　　　　helloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworld

　 </p>

<h1>abcde</h1>

　 <p>

　　goodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworld

　 </p>

　 <p>

　　 gdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymate

　</p>

</body>

</html>

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>CSSの練習</title>
 </head>
  <body>
     <div class-"black">ここは黒</div>
     <div class="red">ここは赤</div>
     <div class="green">ここは緑</div>
  </body>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

<!doctype html>

<head>

<title>CSSの練習</title>

</head>

<body>

</body>

</html>

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>CSSの練習</title>
  <link rel="stylesheet" type="text/css" href="style.css">
 </head>
  <body>
    <div class="main">
      <h1>Heading 1</h1>
      <a href="#">mainクラスの子要素</a>
      <p>
        helloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworld
      </p>
      <h2>Heading 2</h2>
      <p>
        goodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworld<a href="#">mainクラスの子要素ではないリンク</a>goodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworld
      </p>
      <a href="#">mainクラスの子要素のリンク</a>
      <h2>Heading 2</h2>
      <p>
        gdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymate<a href="#">mainクラスの子要素ではないリンク</a>gdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymate
      </p>
      <p>
        howzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoing
      </p>
     </div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

<!doctype html>

<head>

<title>CSSの練習</title>

</head>

<body>

<h1>Heading 1</h1>

<a href="#">mainクラスの子要素</a>

<p>

helloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworld

</p>

<h2>Heading 2</h2>

<p>

goodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworld<a href="#">mainクラスの子要素ではないリンク</a>goodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworld

</p>

<a href="#">mainクラスの子要素のリンク</a>

<h2>Heading 2</h2>

<p>

gdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymate<a href="#">mainクラスの子要素ではないリンク</a>gdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymate

</p>

<p>

howzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoing

</p>

</div>

</body>

</html>

<input type="text">

1	<input type="text">

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>CSSの練習</title>
  <link rel="stylesheet" type="text/css" href="style.css">
 </head>
  <body>
    <div class="main">
      <h1>Heading 1</h1>
      <a href="#a">mainクラスの子要素</a>
      <p>
        helloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworld
      </p>
      <input type="text">
      <h2>Heading 2</h2>
      <p>
        goodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworld<a href="#b">mainクラスの子要素ではないリンク</a>goodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworld
      </p>
      <a href="#a">mainクラスの子要素のリンク</a>
      <h2>Heading 2</h2>
      <p>
        gdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymate<a href="#c">mainクラスの子要素ではないリンク</a>gdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymate
      </p>
      <p>
        howzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoing
      </p>
    </div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

<!doctype html>

<head>

<title>CSSの練習</title>

</head>

<body>

<h1>Heading 1</h1>

<a href="#a">mainクラスの子要素</a>

<p>

helloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworldhelloworld

</p>

<h2>Heading 2</h2>

<p>

goodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworld<a href="#b">mainクラスの子要素ではないリンク</a>goodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworldgoodbyeworld

</p>

<a href="#a">mainクラスの子要素のリンク</a>

<h2>Heading 2</h2>

<p>

gdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymate<a href="#c">mainクラスの子要素ではないリンク</a>gdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymategdaymate

</p>

<p>

howzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoinghowzgoing

</p>

</div>

</body>

</html>

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>類似要素の練習</title>
  <link rel="stylesheet" type="text/css" href="style.css">
 </head>
  <body>
    <ul>
      <li>The first chile of ul.</li>
      <li>2nd child.</li>
      <li>3rd child.</li>
      <li>4th child.</li>
      <li>The last child.</li>
    </ul>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

<!doctype html>

<head>

<title>類似要素の練習</title>

</head>

<body>

<ul>

<li>The first chile of ul.</li>

<li>2nd child.</li>

<li>3rd child.</li>

<li>4th child.</li>

<li>The last child.</li>

</ul>

</body>

</html>

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>色の指定方法についての練習</title>
  <link rel="stylesheet" type="text/css" href="style.css">
 </head>
  <body>
    <h1>Color Values</h1>
    <div></div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

<!doctype html>

<head>

<title>色の指定方法についての練習</title>

</head>

<body>

<h1>Color Values</h1>

</body>

</html>

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>文字のスタイルについての練習</title>
  <link rel="stylesheet" type="text/css" href="style.css">
 </head>
  <body>
    <h1>Hello world</h1>
    <p>
      Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide. 
    </p>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<!doctype html>

<head>

<title>文字のスタイルについての練習</title>

</head>

<body>

<h1>Hello world</h1>

<p>

Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide.

</p>

</body>

</html>

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>文字のスタイルについての練習</title>
  <link rel="stylesheet" type="text/css" href="style.css">
 </head>
  <body>
    <h1>helloworld</h1>
    <ul>
     <li>Istudyprogramingtoday</li>
     <li>Istudyenglishtoday</li>
     <li>Istudyhowtowriteblogtoday</li>
     <li>Istudymusictoday</li>
     <li>Istudymathandsciencetoday</li>
   </ul>
    <ol>
      <li>gdaymategdaymategdaymategdaymate</li>
      <li>howzgoinghowzgoinghowzgoinghowzgoing</li>
      <li>vegematevegematevegematevegemate</li>
      <li>hangoverhangoverhangoverhangover</li>
      <li>loveaustralialoveaustralialoveaustralia</li>
    </ol>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

<!doctype html>

<head>

<title>文字のスタイルについての練習</title>

</head>

<body>

<h1>helloworld</h1>

<ul>

<li>Istudyprogramingtoday</li>

<li>Istudyenglishtoday</li>

<li>Istudyhowtowriteblogtoday</li>

<li>Istudymusictoday</li>

<li>Istudymathandsciencetoday</li>

</ul>

<ol>

<li>gdaymategdaymategdaymategdaymate</li>

<li>howzgoinghowzgoinghowzgoinghowzgoing</li>

<li>vegematevegematevegematevegemate</li>

<li>hangoverhangoverhangoverhangover</li>

<li>loveaustralialoveaustralialoveaustralia</li>

</ol>

</body>

</html>

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>ボックスの考え方</title>
  <link rel="stylesheet" type="text/css" href="style.css">
 </head>
  <body>
    <div>
      <p>
       Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide. 
      </p>
    </div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

<!doctype html>

<head>

<title>ボックスの考え方</title>

</head>

<body>

<div>

<p>

Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide.

</p>

</div>

</body>

</html>

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>ボックスの考え方</title>
  <link rel="stylesheet" type="text/css" href="style.css">
 </head>
  <body>
    <nav>
      <a href="#">About me</a>
      <a href="#">My work</a>
      <a href="#">Contact me</a>
    </nav>
    <div>
      <p>
       Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide. 
      </p>
      <p>
        The Gold Coast is a coastal city in the Australian state of Queensland, approximately 66 kilometres south-southeast of the state capital Brisbane and immediately north of the border with New South Wales. With a census-estimated 2016 population of 638,090,the Gold Coast is the sixth-largest city in Australia, making it the largest non-capital city, and Queensland's second-largest city.
        The Gold Coast region remained largely uninhabited by Europeans until 1823 when explorer John Oxley landed at Mermaid Beach. The hinterland's red cedar supply attracted people to the area in the mid-19th century. Later in 1875, Southport was surveyed and established and grew a reputation as a secluded holiday destination for wealthy Brisbane residents. 
      </p>
      <p>
        Melbourne is the capital and most populous city of the Australian state of Victoria, and the second most populous city in Australia and Oceania.Its name refers to an urban agglomeration of 9,992.5 km2 comprising a metropolitan area with 31 municipalities,nd is also the common name for its city centre. The city occupies much of the coastline of Port Phillip bay and spreads into the hinterlands towards the Dandenong and Macedon ranges, Mornington Peninsula and Yarra Valley. It has a population of approximately 4.9 million (19% of the population of Australia), and its inhabitants are referred to as "Melburnians"
      </p>
    </div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

<!doctype html>

<head>

<title>ボックスの考え方</title>

</head>

<body>

<nav>

<a href="#">About me</a>

<a href="#">Contact me</a>

</nav>

<div>

<p>

Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide.

</p>

<p>

The Gold Coast is a coastal city in the Australian state of Queensland, approximately 66 kilometres south-southeast of the state capital Brisbane and immediately north of the border with New South Wales. With a census-estimated 2016 population of 638,090,the Gold Coast is the sixth-largest city in Australia, making it the largest non-capital city, and Queensland's second-largest city.

The Gold Coast region remained largely uninhabited by Europeans until 1823 when explorer John Oxley landed at Mermaid Beach. The hinterland's red cedar supply attracted people to the area in the mid-19th century. Later in 1875, Southport was surveyed and established and grew a reputation as a secluded holiday destination for wealthy Brisbane residents.

</p>

<p>

Melbourne is the capital and most populous city of the Australian state of Victoria, and the second most populous city in Australia and Oceania.Its name refers to an urban agglomeration of 9,992.5 km2 comprising a metropolitan area with 31 municipalities,nd is also the common name for its city centre. The city occupies much of the coastline of Port Phillip bay and spreads into the hinterlands towards the Dandenong and Macedon ranges, Mornington Peninsula and Yarra Valley. It has a population of approximately 4.9 million (19% of the population of Australia), and its inhabitants are referred to as "Melburnians"

</p>

</div>

</body>

</html>

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>ボックスの考え方</title>
  <link rel="stylesheet" type="text/css" href="style.css">
 </head>
  <body>
    <div>
      <img src="./abc.jpg" alt="techacademy" title="techacademy">
      <p>
       Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide. 
      </p>
    </div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

<!doctype html>

<head>

<title>ボックスの考え方</title>

</head>

<body>

<div>

<p>

Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide.

</p>

</div>

</body>

</html>

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>ボックスの考え方</title>
  <link rel="stylesheet" type="text/css" href="style.css">
 </head>
  <body>
    <div>
      <div class="top">top</div>
      <div class="middle">middle</div>
      <div class="bottom">bottom</div>
    </div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

<!doctype html>

<head>

<title>ボックスの考え方</title>

</head>

<body>

<div>

<div class="middle">middle</div>

<div class="bottom">bottom</div>

</div>

</body>

</html>

<!doctype html>
 
<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>Multiple Background Images</title>
  <link rel="stylesheet" href="style.css">
 </head>
  <body>
    <div class="skech-img"></div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

<!doctype html>

<head>

<title>Multiple Background Images</title>

</head>

<body>

</body>

</html>

<!doctype html>

<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>Background Properties</title>
  <link rel="stylesheet" href="page-styles.css">
  <link rel="stylesheet" href="style.css">
 </head>
  <body>
    <div class="scroll attch">
    <h2>scroll</h2>
    <p>
    	Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide. 
    </p>
     <p>
    	The Gold Coast is a coastal city in the Australian state of Queensland, approximately 66 kilometres south-southeast of the state capital Brisbane and immediately north of the border with New South Wales. With a census-estimated 2016 population of 638,090,the Gold Coast is the sixth-largest city in Australia, making it the largest non-capital city, and Queensland's second-largest city.
        The Gold Coast region remained largely uninhabited by Europeans until 1823 when explorer John Oxley landed at Mermaid Beach. The hinterland's red cedar supply attracted people to the area in the mid-19th century. Later in 1875, Southport was surveyed and established and grew a reputation as a secluded holiday destination for wealthy Brisbane residents.  
    </p>
     <p>
    	Melbourne is the capital and most populous city of the Australian state of Victoria, and the second most populous city in Australia and Oceania.Its name refers to an urban agglomeration of 9,992.5 km2 comprising a metropolitan area with 31 municipalities,nd is also the common name for its city centre. The city occupies much of the coastline of Port Phillip bay and spreads into the hinterlands towards the Dandenong and Macedon ranges, Mornington Peninsula and Yarra Valley. It has a population of approximately 4.9 million (19% of the population of Australia), and its inhabitants are referred to as "Melburnians"
    </p>
    </div>
    <div class="fixed attch">
    <h2>Fixed</h2>
    <p>
    	Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide. 
    </p>
     <p>
    	The Gold Coast is a coastal city in the Australian state of Queensland, approximately 66 kilometres south-southeast of the state capital Brisbane and immediately north of the border with New South Wales. With a census-estimated 2016 population of 638,090,the Gold Coast is the sixth-largest city in Australia, making it the largest non-capital city, and Queensland's second-largest city.
        The Gold Coast region remained largely uninhabited by Europeans until 1823 when explorer John Oxley landed at Mermaid Beach. The hinterland's red cedar supply attracted people to the area in the mid-19th century. Later in 1875, Southport was surveyed and established and grew a reputation as a secluded holiday destination for wealthy Brisbane residents.  
    </p>
     <p>
    	Melbourne is the capital and most populous city of the Australian state of Victoria, and the second most populous city in Australia and Oceania.Its name refers to an urban agglomeration of 9,992.5 km2 comprising a metropolitan area with 31 municipalities,nd is also the common name for its city centre. The city occupies much of the coastline of Port Phillip bay and spreads into the hinterlands towards the Dandenong and Macedon ranges, Mornington Peninsula and Yarra Valley. It has a population of approximately 4.9 million (19% of the population of Australia), and its inhabitants are referred to as "Melburnians"
    </p>
    </div>
     <div class="local attch">
    <h2>Local</h2>
     <p>
    	Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide. 
    </p>
     <p>
    	The Gold Coast is a coastal city in the Australian state of Queensland, approximately 66 kilometres south-southeast of the state capital Brisbane and immediately north of the border with New South Wales. With a census-estimated 2016 population of 638,090,the Gold Coast is the sixth-largest city in Australia, making it the largest non-capital city, and Queensland's second-largest city.
        The Gold Coast region remained largely uninhabited by Europeans until 1823 when explorer John Oxley landed at Mermaid Beach. The hinterland's red cedar supply attracted people to the area in the mid-19th century. Later in 1875, Southport was surveyed and established and grew a reputation as a secluded holiday destination for wealthy Brisbane residents.  
    </p>
     <p>
    	Melbourne is the capital and most populous city of the Australian state of Victoria, and the second most populous city in Australia and Oceania.Its name refers to an urban agglomeration of 9,992.5 km2 comprising a metropolitan area with 31 municipalities,nd is also the common name for its city centre. The city occupies much of the coastline of Port Phillip bay and spreads into the hinterlands towards the Dandenong and Macedon ranges, Mornington Peninsula and Yarra Valley. It has a population of approximately 4.9 million (19% of the population of Australia), and its inhabitants are referred to as "Melburnians"
    </p>
    </div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

<!doctype html>

<head>

<title>Background Properties</title>

</head>

<body>

<h2>scroll</h2>

<p>

Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide.

</p>

<p>

The Gold Coast is a coastal city in the Australian state of Queensland, approximately 66 kilometres south-southeast of the state capital Brisbane and immediately north of the border with New South Wales. With a census-estimated 2016 population of 638,090,the Gold Coast is the sixth-largest city in Australia, making it the largest non-capital city, and Queensland's second-largest city.

The Gold Coast region remained largely uninhabited by Europeans until 1823 when explorer John Oxley landed at Mermaid Beach. The hinterland's red cedar supply attracted people to the area in the mid-19th century. Later in 1875, Southport was surveyed and established and grew a reputation as a secluded holiday destination for wealthy Brisbane residents.

</p>

<p>

Melbourne is the capital and most populous city of the Australian state of Victoria, and the second most populous city in Australia and Oceania.Its name refers to an urban agglomeration of 9,992.5 km2 comprising a metropolitan area with 31 municipalities,nd is also the common name for its city centre. The city occupies much of the coastline of Port Phillip bay and spreads into the hinterlands towards the Dandenong and Macedon ranges, Mornington Peninsula and Yarra Valley. It has a population of approximately 4.9 million (19% of the population of Australia), and its inhabitants are referred to as "Melburnians"

</p>

</div>

<h2>Fixed</h2>

<p>

Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide.

</p>

<p>

The Gold Coast is a coastal city in the Australian state of Queensland, approximately 66 kilometres south-southeast of the state capital Brisbane and immediately north of the border with New South Wales. With a census-estimated 2016 population of 638,090,the Gold Coast is the sixth-largest city in Australia, making it the largest non-capital city, and Queensland's second-largest city.

The Gold Coast region remained largely uninhabited by Europeans until 1823 when explorer John Oxley landed at Mermaid Beach. The hinterland's red cedar supply attracted people to the area in the mid-19th century. Later in 1875, Southport was surveyed and established and grew a reputation as a secluded holiday destination for wealthy Brisbane residents.

</p>

<p>

Melbourne is the capital and most populous city of the Australian state of Victoria, and the second most populous city in Australia and Oceania.Its name refers to an urban agglomeration of 9,992.5 km2 comprising a metropolitan area with 31 municipalities,nd is also the common name for its city centre. The city occupies much of the coastline of Port Phillip bay and spreads into the hinterlands towards the Dandenong and Macedon ranges, Mornington Peninsula and Yarra Valley. It has a population of approximately 4.9 million (19% of the population of Australia), and its inhabitants are referred to as "Melburnians"

</p>

</div>

<h2>Local</h2>

<p>

Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide.

</p>

<p>

The Gold Coast is a coastal city in the Australian state of Queensland, approximately 66 kilometres south-southeast of the state capital Brisbane and immediately north of the border with New South Wales. With a census-estimated 2016 population of 638,090,the Gold Coast is the sixth-largest city in Australia, making it the largest non-capital city, and Queensland's second-largest city.

The Gold Coast region remained largely uninhabited by Europeans until 1823 when explorer John Oxley landed at Mermaid Beach. The hinterland's red cedar supply attracted people to the area in the mid-19th century. Later in 1875, Southport was surveyed and established and grew a reputation as a secluded holiday destination for wealthy Brisbane residents.

</p>

<p>

Melbourne is the capital and most populous city of the Australian state of Victoria, and the second most populous city in Australia and Oceania.Its name refers to an urban agglomeration of 9,992.5 km2 comprising a metropolitan area with 31 municipalities,nd is also the common name for its city centre. The city occupies much of the coastline of Port Phillip bay and spreads into the hinterlands towards the Dandenong and Macedon ranges, Mornington Peninsula and Yarra Valley. It has a population of approximately 4.9 million (19% of the population of Australia), and its inhabitants are referred to as "Melburnians"

</p>

</div>

</body>

</html>

<!doctype html>
 
<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>Full page background images</title>
  <link rel="stylesheet" href="style.css">
 </head>
  <body>
    <div class="box">
      <!-- Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide.-->
    </div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

<!doctype html>

<head>

<title>Full page background images</title>

</head>

<body>

</div>

</body>

</html>

<!doctype html>
 
<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>ボックスの考え方</title>
  <link rel="stylesheet" href="style.css">
 </head>
  <body>
    <div>
      <p>
        Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide.
      </p>
    </div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

<!doctype html>

<head>

<title>ボックスの考え方</title>

</head>

<body>

<div>

<p>

Australia, officially the Commonwealth of Australia,is a sovereign country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the largest country in Oceania and the world's sixth-largest country by total area. The neighbouring countries are Papua New Guinea, Indonesia and East Timor to the north; the Solomon Islands and Vanuatu to the north-east; and New Zealand to the south-east. The population of 25 million is highly urbanised and heavily concentrated on the eastern seaboard. Australia's capital is Canberra, and its largest city is Sydney. The country's other major metropolitan areas are Melbourne, Brisbane, Perth and Adelaide.

</p>

</div>

</body>

</html>

<!doctype html>
 
<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>ボックスの考え方</title>
  <link rel="stylesheet" href="style.css">
 </head>
  <body>
    <div class="rounded-box"></div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

<!doctype html>

<head>

<title>ボックスの考え方</title>

</head>

<body>

</body>

</html>

<!doctype html>
 
<html lang="ja">
 <head>
  <meta charset="UTF-8">
  <title>ボックスの考え方</title>
  <link rel="stylesheet" href="style.css">
 </head>
  <body>
    <div class="box"></div>
  </body>
</html>

1

2

3

4

5

6

7

8

9

10

11

12

<!doctype html>

<head>

<title>ボックスの考え方</title>

</head>

<body>

</body>

</html>

Programing beginner by koala

Programing beginner by koala

【TechAcademy】はじめてのCSS入門：動画で使用するソースコードを用意しました！

Tech Academy【CSSの動画】1-4～1-5のソースコード

Tech Academy【CSSの動画】2-1～2-2のソースコード

Tech Academy【CSSの動画】2-3のソースコード

Tech Academy【CSSの動画】2-4～2-5のソースコード

Tech Academy【CSSの動画】2-6のソースコード

Tech Academy【CSSの動画】2-7のソースコード

Tech Academy【CSSの動画】3-3のソースコード

Tech Academy【CSSの動画】4-2～4-5のソースコード

Tech Academy【CSSの動画】4-6のソースコード

Tech Academy【CSSの動画】5-1～5-2のソースコード

Tech Academy【CSSの動画】5-3～5-4のソースコード

Tech Academy【CSSの動画】6-1のソースコード

Tech Academy【CSSの動画】6-2～6-3のソースコード

Tech Academy【CSSの動画】7-1のソースコード

Tech Academy【CSSの動画】7-2のソースコード

Tech Academy【CSSの動画】7-3のソースコード

Tech Academy【CSSの動画】8-1のソースコード

Tech Academy【CSSの動画】8-2のソースコード

Tech Academy【CSSの動画】8-3のソースコード

About me

今日の名言

最近の投稿

アーカイブ

カテゴリー

About me

Work

twitter