Description:-
In this
Example we Explain that how to Display your Content of the page in Three
Coloumn in webpage. We all see that in
Newspaper Site the Content of the News was display in three coloumn or we also
see in some Articles content same Like this so to Display Your Content in three
coloumn this example is used.
in this Example we used External Stylesheet and Devide page into three part like 33 % and displaying this type of Format. here is a style to Display a part of the 33%.
For Ex:-
in this Example we used External Stylesheet and Devide page into three part like 33 % and displaying this type of Format. here is a style to Display a part of the 33%.
For Ex:-
#column1 {
float:left;
width: 33%;
}
The main
Advantages of the this Example is to Devloping Website Like Newspaper or Artcle
at that time this is very useful and you can Display Your News and page content
in webpage very clearly.
Example:-
<html>
<head>
<link rel="stylesheet"
href="stylefloat.css"
type="text/css"
/>
</head>
<body>
<h1>Columns</h1>
<div
id="column1">
<p>Iste quidem veteres inter ponetur honeste, qui
vel mense brevi vel toto est iunior anno. Utor permisso, caudaeque pilos ut
equinae paulatim vello unum, demo etiam unum, dum cadat elusus ratione ruentis
acervi, qui redit in fastos et annis miraturque.</p>
<p>Indignor quicquam reprehendi, non quia crasse
compositum illepedeve putetur, sed quia nuper, nec veniam antiquis, sed honorem
</p>
<p>Brevi vel toto est iunior anno. Utor permisso,
caudaeque pilos ut equinae paulatim vello unum, demo etiam unum. Si meliora
dies, ut vina, poemata reddit, scire velim, chartis perficit quotus pretium
quotus arroget annus. Scriptor abhinc reddit misso annos centum qui decidit,
inter perfectos veteresque referri debet an inter vilis atque perfectos novos?
Excludat iurgia finis. ìEst vetus atque probus, centum qui perficit annos.î
Quid, qui deperiitnihis perfectos uno mense vel?ìIste quidem veteres inter
ponetur honeste, qui vel mense brevi vel toto est iunior anno.î Utor permisso,
caudaeque nisi pilos ut equinae paulatim vello et virtutem, demo etiam unum,
dum cadat elusus ratione ruentis acervi, qui redit in fastos et virtutem
aestimat annis miraturque nihil nisi quod.Ennius et sapines et fortis et alter
Homerus, ut critici dicunt, leviter curare videtur</p>
</div>
<div
id="column2">
<p>Brevi vel toto est iunior anno. Utor permisso,
caudaeque pilos ut equinae paulatim vello unum, demo etiam unum. Si meliora
dies, ut vina, poemata reddit, scire velim, chartis perficit quotus pretium
quotus arroget annus. Scriptor abhinc reddit m</p>
<p>esse, is non videt quae quamque rem res
consequatur. Haec disserens qua de re agatur et in quo causa consistat non
videt. Non enim si alii ad alia propensiores sunt propter causas naturales et
antecedentes, idciro etiam nostrarum voluntatum atque appetitionum sunt causae
naturales at antecedentes; nam nihil esset in nostra potestate si res ita se
haberet. Nunc vero fatemur, acuti hebetesne, valentes imbecilline simus, non
esse id in nobis, qui autem ex eo cogi putat ne ut sedeamus quidem au</p>
</div>
<div
id="column3">
<p>dictare; sed emendata videri pulchraque et
exactis minimum distantia miror. Inter quae verbum emicuit si forte decorum, et
si versus paulo concinnior unus et alter, venditque poema.</p>
<p>Indignor quicquam reprehendi, non quia crasse
compositum illepedeve putetur, sed quia nuper, nec veniam antiquis, sed honorem
et praemia posci. Recte necne crocum floresque perambulet Attae fabula si
dubitem, clament periisse pudorem cuncti paene patres, ea cum reprehendere
coner, quae gravis Aesopus, quae doctus Roscius egit; vel quia nil rectum, nisi
quod placuit sibi, ducunt, vel quia turpe putant parere minoribus, et quae
imberbes senes.</p>
<p>Quod si tam Graecis novitas invisa fuisset quam
nobis, quid nunc esset vetus? Aut quid haberet quod legeret tereretque
viritim.Ut primum positis nugari Graecia bellis coepit et in vitium fortuna
labier aequa, nunc athletarum studiis, nunc arsit equorum, marmoris aut eboris
fabros aut aeris amavit, tibicinibus, nunc est gavisa tragoedis; puella.</p>
</div>
</body>
</html>
StyleFloat.css
<style type="text/css">
#column1 {
float:left;
width: 33%;
}
#column2 {
float:left;
width: 33%;
}
#column3 {
float:left;
width: 33%;
}
</style>
0 comments:
Post a Comment