Suddividere il testo in colonne con i css

Tutorial CSS

Breve tutorial per suddividere in x colonne un blocco di testo.

Codice stile css


 <!--Inizio -->


<style>
#testo_incolonnato
{
 /* n colonne blocco di testo */
-moz-column-count:2;
-webkit-column-count:2;
column-count:2;

 /* stile bordo divisorio */
-moz-column-rule:1px dotted #ffcc00;
-webkit-column-rule:1px dotted #ffcc00;
column-rule:4px 1px dotted #ffcc00;

 /* spazio fra colonne */
-moz-column-gap:20px;
-webkit-column-gap:20px;
column-gap:20px;

}
</style>

 <!--Fine -->

All'interno del <body> inseriamo il <div id="testo_incolonnato">.

Esempio 1: due colonne, divisorio dotted giallo.



Telecommunication is the science and practice of transmitting information by electromagnetic means. Communication is talking to someone or thing not necessarily through technological means. Telecommunication, however, is talking through technology meaning phones, Internet, radio etc... In earlier times, telecommunications involved the use of visual signals, such as beacons, smoke signals, semaphore telegraphs, signal flags, and optical heliographs, or audio messages such as coded drumbeats, lung-blown horns, and loud whistles. In modern times, telecommunications involves the use of electrical devices such as the telegraph, telephone, and teleprinter, as well as the use of radio and microwave communications, as well as fiber optics and their associated electronics, plus the use of the orbiting satellites and the Internet. A revolution in wireless telecommunications began in the 1900s (decade) with pioneering developments in wireless radio communications by Nikola Tesla and Guglielmo Marconi. Marconi won the Nobel Prize in Physics in 1909 for his efforts. Other highly notable pioneering inventors and developers in the field of electrical and electronic telecommunications include Charles Wheatstone and Samuel Morse (telegraph), Alexander Graham Bell (telephone), Edwin Armstrong, and Lee de Forest (radio), as well as John Logie Baird and Philo Farnsworth (television). The world's effective capacity to exchange information through two-way telecommunication networks grew from 281 petabytes of (optimally compressed) information in 1986, to 471 petabytes in 1993, to 2.2 (optimally compressed) exabytes in 2000, and to 65 (optimally compressed) exabytes in 2007.[1] This is the informational equivalent of 2 newspaper pages per person per day in 1986, and 6 entire newspapers per person per day by 2007.[2] Given this growth, telecommunications play an increasingly important role in the world economy and the global telecommunications industry was about a $4.7 trillion sector in 2012.[3][4] The service revenue of the global telecommunications industry was estimated to be $1.5 trillion in 2010, corresponding to 2.4% of the world’s gross domestic product (GDP).[3]


Esempio 2: 3 colonne divisorio solid rosso.



Telecommunication is the science and practice of transmitting information by electromagnetic means. Communication is talking to someone or thing not necessarily through technological means. Telecommunication, however, is talking through technology meaning phones, Internet, radio etc... In earlier times, telecommunications involved the use of visual signals, such as beacons, smoke signals, semaphore telegraphs, signal flags, and optical heliographs, or audio messages such as coded drumbeats, lung-blown horns, and loud whistles. In modern times, telecommunications involves the use of electrical devices such as the telegraph, telephone, and teleprinter, as well as the use of radio and microwave communications, as well as fiber optics and their associated electronics, plus the use of the orbiting satellites and the Internet. A revolution in wireless telecommunications began in the 1900s (decade) with pioneering developments in wireless radio communications by Nikola Tesla and Guglielmo Marconi. Marconi won the Nobel Prize in Physics in 1909 for his efforts. Other highly notable pioneering inventors and developers in the field of electrical and electronic telecommunications include Charles Wheatstone and Samuel Morse (telegraph), Alexander Graham Bell (telephone), Edwin Armstrong, and Lee de Forest (radio), as well as John Logie Baird and Philo Farnsworth (television). The world's effective capacity to exchange information through two-way telecommunication networks grew from 281 petabytes of (optimally compressed) information in 1986, to 471 petabytes in 1993, to 2.2 (optimally compressed) exabytes in 2000, and to 65 (optimally compressed) exabytes in 2007.[1] This is the informational equivalent of 2 newspaper pages per person per day in 1986, and 6 entire newspapers per person per day by 2007.[2] Given this growth, telecommunications play an increasingly important role in the world economy and the global telecommunications industry was about a $4.7 trillion sector in 2012.[3][4] The service revenue of the global telecommunications industry was estimated to be $1.5 trillion in 2010, corresponding to 2.4% of the world’s gross domestic product (GDP).[3]

Attenzione: Questo effetto di stile non è supportato da IE.

codice:

<style>
#testo_incolonnato_1
{
-moz-column-count:3; 
-webkit-column-count:3; 
column-count:3;


-moz-column-rule:1px solid #cc0000; 
-webkit-column-rule:1px solid #cc0000;
column-rule:4px 1px solid #cc0000;


-moz-column-gap:5px;
-webkit-column-gap:5px; 
column-gap:5px;

text-align:justify;
}
</style>

<body>



<div id="testo_incolonnato_1">
Telecommunication is the science and practice of transmitting information by electromagnetic means.

Communication is talking to someone or thing not necessarily through technological means. Telecommunication, however, is talking through technology meaning phones, Internet, radio etc...

In earlier times, telecommunications involved the use of visual signals, such as beacons, smoke signals, semaphore telegraphs, signal flags, and optical heliographs, or audio messages such as coded drumbeats, lung-blown horns, and loud whistles.

In modern times, telecommunications involves the use of electrical devices such as the telegraph, telephone, and teleprinter, as well as the use of radio and microwave communications, as well as fiber optics and their associated electronics, plus the use of the orbiting satellites and the Internet.

A revolution in wireless telecommunications began in the 1900s (decade) with pioneering developments in wireless radio communications by Nikola Tesla and Guglielmo Marconi. Marconi won the Nobel Prize in Physics in 1909 for his efforts. Other highly notable pioneering inventors and developers in the field of electrical and electronic telecommunications include Charles Wheatstone and Samuel Morse (telegraph), Alexander Graham Bell (telephone), Edwin Armstrong, and Lee de Forest (radio), as well as John Logie Baird and Philo Farnsworth (television).

The world's effective capacity to exchange information through two-way telecommunication networks grew from 281 petabytes of (optimally compressed) information in 1986, to 471 petabytes in 1993, to 2.2 (optimally compressed) exabytes in 2000, and to 65 (optimally compressed) exabytes in 2007.[1] This is the informational equivalent of 2 newspaper pages per person per day in 1986, and 6 entire newspapers per person per day by 2007.[2] Given this growth, telecommunications play an increasingly important role in the world economy and the global telecommunications industry was about a $4.7 trillion sector in 2012.[3][4] The service revenue of the global telecommunications industry was estimated to be $1.5 trillion in 2010, corresponding to 2.4% of the world’s gross domestic product (GDP).[3]
</div>

Incolonnare i risultati di una query. Impaginiamo i dati.

Tutorial php

Supponiamo di voler visualizzare i risultati di una query ordinati in celle di una tabella.
Una tabella con 3 colonne.
Ogni 3 colonne di risultati, vai a capo (crea un'altra riga).

Eseguo la Query:


 <!--Inizio -->


<?php  ////query dei dati che voglio vedere....
$query="SELECT users.* FROM  users limit 20 ";
$result = mysql_query($query);
$number = mysql_numrows($result);
$y = 0;?>

 <table   border="0" width=400  cellpadding="2"  cellspacing="2"  >
  <tr>

<?
$numerocolonne =3;
////numero di colonne della tabella html
$
numerorighe=0;
while ($number > $y)
{
if ($numerorighe>$
numerocolonne-1) {$numerorighe=0; print "</tr><tr>";} 
$i = 0;

////estrapolo i valori delle colonne della tabella users
$id= mysql_result($result,$y,"id");   
$nome= mysql_result($result,$y,"nome");
$cognome= mysql_result($result,$y,"cognome");   

////inizio a stampare a video i risultati, aprendo un <td>
echo"
<td valign=top   align=left>
$nome $cognome";

////chiudo il ciclo della query
$y++;    
$numerorighe++;}
?>

</tr></table>


 <!--Fine -->

Formattando a piacere la tabella (o inserendo una <table> all'interno della riga che abbiamo aperto in php) otterremo un'impaginazione pulita ed incolonnata.
La scelta del numero di colonne in cui suddividere i risultati della tabella è il valore: $numerocolonne .

Select LIKE in mysql, un semplice sistema di ricerca in php per il nostro sito.

Tutorial php

Cerchiamo all'interno di una tabella (users) un dato che ci interessa. Supponiamo di avere un database che contiene n. aziende, ed in questa tabella abbiamo vari campi fra cui il campo "ragionesociale". Vogliamo cercare tutte le aziende che abbiano il nominativo "simile" a "Rossi".

Modulo di ricerca: {ps. consiglio di creare un file da includere nella pagina, in modo da intervenire modificandolo UNA sola volta indipendentemente dal numero di pagine del sito. Chiamiamo questo file ricerca.php, e lo includiamo.}

Pagina ricerca.php
Prima di tutto inseriamo nel codice sorgente della pagina un semplice form di ricerca come questo:






<form id="search" action="/search.php" method="post">
<input type="text" value="Ricerca per nome azienda" name="search" size="50" />
<input type="submit" name="submit" value="Cerca!" /></form>

Il form punta alla pagina /search.php.

Includiamo "ricerca.php" nelle pagine del sito:
utilizzando la stringa <? include('ricerca.php');?>


Pagina search.php: la pagina che visualizzerà i risultati della nostra ricerca. Incolliamo nel punto in cui vogliamo far comparire i risultati della riceca questa porzione di codice:

<? //richiamiamo la stringa di ricerca:
$search = $_POST['search'];
//contiamo i risultati trovati e stampiamo il numero:
$count = mysql_query("SELECT COUNT(id) FROM users where users.ragionesociale LIKE '%$search%'");
$res_count = mysql_fetch_row($count);
// numero totale di records
$tot_records = $res_count[0];
echo"<H3>HO TROVATO: $tot_records RISULTATI x  &quot; $search &quot;</H3>";
//cerchiamo nel database i dati corrispondenti:
//query di ricerca
$ricerca="SELECT users.ragionesociale, users.id
FROM   users
where users.ragionesociale LIKE '%$search%'";
$result = mysql_query($ricerca);
$number = mysql_numrows($result);
$y = 0;
while ($number > $y)
{

$id= mysql_result($result,$y,"id");   
$ragionesociale    = mysql_result($result,$y,"users.ragionesociale");
//stampo a video le singole tabelle che contengono i risultati
echo"
<table width=450>
<tr>
<td valign=top >
<a href=azienda.php?ID=$id >
$ragionesociale</a><br />
</td></tr></table>";
 // il ciclco continua
$y++; }

?>

La sezione di query " where users.ragionesociale LIKE '%$search%'" può essere integrata da altri valori, per esempio: where users.ragionesociale LIKE '%$search%' or users.website LIKE '%$search%' ... ecc...

Personalizzando la query $ricerca a piacere si otterranno risutati completi e dettagliati, andando a richiamare campi come il telefono, l'indirizzo del sito, la p.iva, la città ecc...
   

Copyright con aggiornamento automatico, php e js

Ci può interessare inserire nel footer delle nostre pagine il simbolo del copyright (&copy;) che si aggiorni automaticamente di anno in anno.

Ecco il codice:

Questa rapida stringa va utilizzata in pagine php.

Il Mio Sito
&copy; Copyright
<?php
$inizio = 2015;
$annoattuale= date('Y');
if ($inizio== $annoattuale)
{echo $now;}
else
{echo "$inizio - $annoattuale";} ?>

Il risultato finale sarà:
Il Mio Sito © Copyright 2015 - 2016


La versione in js invece è cosi:

Il Mio Sito
&copy; 2015 -
<script language="JavaScript" type="text/javascript">
ilnostroanno=new Date();  y0=ilnostroanno.getFullYear();</script>
<script language="JavaScript" type="text/javascript"> document.write(y0); </script>