CodeIgniterでホームページの骨格作成２

*{
margin: 0;
padding: 0;
}

body{
color: rgb(51, 51, 51);
font-family: メイリオ, "Hiragino Kaku Gothic Pro", Meiryo, "ヒラギノ角ゴ Pro W3", "MS PGothic", "MS UI Gothic", Helvetica, Arial, sans-serif;
}

p{
line-height: 1.8em;
}

h2{
font-size: 110%;
border-bottom: 1px dotted #ccc;
margin-bottom: 15px;
}

#container{
margin: 0 auto;
width: 970px;
}

#header{
background-color:blue;
height: 150px;   
}

#main{
float: left;
height: 700px;
width: 74%;

}

#sub{
float: right;
height: 700px;
width: 24%;
border-left: 1px solid #E1E1E1;
}

#sub ul{
padding-left: 15px;
}

#sub ul li{
list-style-type: none;
padding: 0 0 5px 0;
}

#sub ul li a{
font-size: 85%;
text-decoration: none;
}

#sub ul li a:link{
color: #03C;
}

#sub ul li a:visited{
color: #639;
}

.content{
padding: 15px;
}

#sub ul li a:hover{
color: #CC3434;
text-decoration: underline;
}

#footer{
background-color:pink;
height: 75px; 
clear: both;  
}

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

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

*{

margin: 0;

padding: 0;

}

body{

color: rgb(51, 51, 51);

font-family: メイリオ, "Hiragino Kaku Gothic Pro", Meiryo, "ヒラギノ角ゴ Pro W3", "MS PGothic", "MS UI Gothic", Helvetica, Arial, sans-serif;

}

p{

line-height: 1.8em;

}

h2{

font-size: 110%;

border-bottom: 1px dotted #ccc;

margin-bottom: 15px;

}

#container{

margin: 0 auto;

width: 970px;

}

#header{

background-color:blue;

height: 150px;

}

#main{

float: left;

height: 700px;

width: 74%;

}

#sub{

float: right;

height: 700px;

width: 24%;

border-left: 1px solid #E1E1E1;

}

#sub ul{

padding-left: 15px;

}

#sub ul li{

list-style-type: none;

padding: 0 0 5px 0;

}

#sub ul li a{

font-size: 85%;

text-decoration: none;

}

#sub ul li a:link{

color: #03C;

}

#sub ul li a:visited{

color: #639;

}

.content{

padding: 15px;

}

#sub ul li a:hover{

color: #CC3434;

text-decoration: underline;

}

#footer{

background-color:pink;

height: 75px;

clear: both;

}

RewriteEngine on
RewriteCond $1 !^(index\.php|style.css)
RewriteRule ^(.*)$ /c/index.php/$1 [L]

1

2

3

RewriteEngine on

RewriteCond $1 !^(index\.php|style.css)

RewriteRule ^(.*)$ /c/index.php/$1 [L]

<?php

class Vba extends CI_Controller {

  public function page($page="1"){

    $val['url'] = "http://localhost/c/"; 
    $val['title'] = "タイトル"; 

    $this->load->view('templates/header', $val);
    $this->load->view('pages/' . $page, $val);
    $this->load->view('templates/footer', $val);

  }

}

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

<?php

class Vba extends CI_Controller {

public function page($page="1"){

$val['url'] = "http://localhost/c/";

$val['title'] = "タイトル";

$this->load->view('templates/header', $val);

$this->load->view('pages/' . $page, $val);

$this->load->view('templates/footer', $val);

}

<h2>タイトル１</h2>
<p>本文が入ります。</p>

1 2	<h2>タイトル１</h2> <p>本文が入ります。</p>

<h2>タイトル２</h2>
<p>本文が入ります。</p>

1 2	<h2>タイトル２</h2> <p>本文が入ります。</p>

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="<?php echo $url; ?>style.css">
<title><?php echo $title; ?></title>
</head>
<body>

<div id="container">

<div id="header">
タイトル
</div>

<div id="main">
<div class="content">

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

<!DOCTYPE html>

<head>

</head>

<body>

タイトル

</div>

</div><!-- content -->
</div><!-- main -->

<div id="sub">
<div class="content">

<ul>
<li><a href="<?php echo $url . "vba/page/1"; ?>">・サブメニュー１</a></li>
<li><a href="<?php echo $url . "vba/page/2"; ?>">・サブメニュー２</a></li>
</ul>

</div>
</div>

<div id="footer">
フッター
</div>

</div>

<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
</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

</div>

</div>

<ul>

<li><a href="<?php echo $url . "vba/page/1"; ?>">・サブメニュー１</a></li>

<li><a href="<?php echo $url . "vba/page/2"; ?>">・サブメニュー２</a></li>

</ul>

</div>

フッター

</div>

</body>

</html>