CSS e Immagini con percorso relativo nella vista
Vediamo come mettere un CSS e un'immagine nel nostro progetto. Li richiameremo direttamente nelle pagine di vista.Creiamo un nuovo progetto e creiamo un controllo e una vista :
controllo.php :
<?php
class controllo extends CI_Controller
{
public function index()
{
$this->load->view('home');
}
}
home.php :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"
/>
<title>Home</title>
<link href="../CSS/default.css"
rel="stylesheet" type="text/css" />
</head>
<body>
<h1>Home</h1>
<img src="../immagini/Immagine.jpg"/>
Nuntio vobis magno cum gaudio: habemus papam!
</body>
</html>
Ipotizziamo che la nostra root sia : http://localhost:8080/CI9possiamo testare la nostra applicazione al link : http://localhost:8080/CI9/index.php/controllo
Creiamo le cartelle CSS e immagini all'altezza della cartella application.
Dentro la CSS creiamo un file default.css e mettiamo un'immagine chiamata immagine.jpg dentro la cartella immagini :
Il codice del css può essere qualunque ad esempio default.css :
@CHARSET "ISO-8859-1";
body {
background-color: #fff;
margin: 40px;
font-family: Lucida Grande,
Verdana, Sans-serif;
font-size: 14px;
color: #4F5155;
}
a {
color: #003399;
background-color:
transparent;
font-weight: normal;
}
h1 {
color: #444;
background-color:
transparent;
border-bottom: 1px solid
#D0D0D0;
font-size: 16px;
font-weight: bold;
margin: 24px 0
2px 0;
padding: 5px 0
6px 0;
}
code {
font-family: Monaco, Verdana, Sans-serif;
font-size: 12px;
background-color:
#f9f9f9;
border: 1px solid
#D0D0D0;
color: #002166;
display: block;
margin: 14px 0
14px 0;
padding: 12px 10px
12px 10px;
}
Dunque le risorse statiche (come CSS e immagini) vengono richiamate dalla vista con il percorso relativo :
../CSS/default.css
e
../immagini/Immagine.jpg
vai all' indice generale
Nessun commento:
Posta un commento