Jump to content
php.lv forumi

div layout fons


renathy
 Share

Recommended Posts

Ir vajadzigs shitads layouts:

layouts vispārīgi - BILDE

layouta augšejais stūris, ar pareizām krāsām - BILDE2

 

 

Viss fons (zilais) veidojas no bildes, kas ir repeat-x.

Vidu ir wrapperis (dzeltens ar zilu borderi). Wraperi ieksha ir contents (zaljas krasas).

Sturiti augsha ir bilde.

 

Ta ka pirmo reizi taisu div layout no nulles un vispar ar CSS rakstu pati, tad te dazhas neskaidribas...

Pagaidam tikai dazhas rindas ir uzrakstitas:

 

<div id="fons"></div>
<div id="fona_bilde"></div>

<div id="wrapper">
  <!-- te vel bus -->
</div>

 

#fons {
 background-image: url('bg.jpg');
 background-repeat: repeat-x;
 height: 1000px;
}

#fona_bilde {
 background-image: url('bgimg.png');  
 background-repeat: no-repeat;
 position: absolute;
 width: 100%;
 left: 0;
 top: 0;    
 margin: 0;
}

#wrapper {

<!-- divs ar borderu, kur ieksha bus contents -->

}

 

- Vai shadi idejiski pareizi?

- Vai varbut labak to bildi ielikt vel ieksh diva, t.i.,

<div id="img_wrapper"><div id="fona_bilde"></div></div>

- Vai ari vel -varbut nemaz tam fonam nevajaga div-us, bet ar body CSS iztiek?

 

- Un tas, ko vel nekadigi nesaprotu - ka panakt, lai ta fona bilde it ka parklaj wrapperi, bet tomer ir zem wrappera bordera un ir ari zem contenta, kas ir divi ieksh wrappera? Te laikam wrapper borders jaaizvieto ar kadu citu divu... brr?

Edited by renathy
Link to comment
Share on other sites

Permission denied - this album is private.

 

- Vai varbut labak to bildi ielikt vel ieksh diva, t.i.,

liekus div nevajag. jo vienkāršāk, jo labāk

 

- Vai ari vel -varbut nemaz tam fonam nevajaga div-us, bet ar body CSS iztiek?

tā kā vienam html elementam diemžēl var piešķirt tikai vienu bg, tad body bg labāk lai ir rezervēts tiem bg, kas iziet ārpus wrappera. ja bg iekļaujas wrapperī, tad lai tas ir wrapper bg (arī tad, ja wrapperis ar width:100% būtu pa visu body. varētu pat padomāt, ka tad vispār varētu iztikt bez tāda wrappera, taču tas tomēr ir noderīgs kaut vai lai ar overflow:hidden uztaisītu auto clear iekšējiem floating diviem)

 

- Un tas, ko vel nekadigi nesaprotu - ka panakt, lai ta fona bilde it ka parklaj wrapperi, bet tomer ir zem wrappera bordera un ir ari zem contenta, kas ir divi ieksh wrappera?

es arī to nekādīgi nesaprotu! kādu laiku dzīvojot 3D pasaulē, es esmu pieradis domāt, ka kkas nevar atrasties divās vietās vienlaicīgi :D "fona bilde" var būt vai nu zem wrappera (it kā loģiski priekš fona) vai virs tā (diezgan jocīgi). tās "fona" daļas, kas iet pāri wrapperim, liec atsevišķa divā un nopozicionē (+ lieto z-index, ja vajag menedžēt pārklāšanos vēl ar citiem šādi pozicionētiem diviem). un wrappera css border pieder wrapperim un nav caurspīdīgs

 

uztaisi to albūmu public, savādāk es noteikti iztēlojos kko citu nekā tev tur ir

 

aa un gan jau mefisto uzradīsies un iedos kādu labu linku, kā layoutus taisīt ;)

Link to comment
Share on other sites

"Vai lapa ir fiksēta platuma ?" - Who knows???

A kādas iespējas, nu man nav noteikts un kā būtu labāk?

 

A kādas priekšrocības ielikt body tagā fona daļu. Saprotu ka var tā un var arī divā ielikt, bet reāli - kā labāk?

 

 

R.

Varbūt mani jautājumi ir muļķīgi, bet ja pirmo reizi kko dara, tad tādi rodas...

Link to comment
Share on other sites

Nu to vai lapa ir fiksēta platuma parasti var redzēt no dizaina.

Un tur nav "labāk" vai "sliktāk". Ir tā kā dizaineris/māksliniece grib.

Vispāŗ to vajadzētu varēt pateikt no tā , vai tā bilde "turas" vienmēr pie loga malas ( kreisajā pusē )

vai arī pie lapas satura ( tb. pie #wrapper ).

 

Un priekšrocības īsti nekādas nav. Vienkārši pastāv princips, ka labā kodā nav (daudz) lieku tagu.

 

 

Anyway.

No tā ko tu parādīji otrajā bildē ... emm .. netaisi to fonu caurspīdīgu iekš #wrapper.

NEvajag. Drausmīgs čakars uz IE6 un IE7.

 

 

Nez.. bez visa dizaina baigi grūti spriest.

Link to comment
Share on other sites

Kā jau te daži minēja, tādus dizainus taisot nāksies izmantot pozicionēšanu. Principā ja dizaina izmērs ir mainīgs (mainot pārlūka izmēru), tad tos apaļos stūrīšos jēdzīgākais variants ir taisīt tieši ar pozicionēšanu. Vienīgi uzreiz varu ieteikt visu labi pārbaudīt IE6, neesmu viņu ļoti spēcīgi izmēģinājis, bet šķiet viņam dažreiz kādu dīvainu iemeslu pēc pie pozicionēšanas norādot right un bottom vērtības rodas 1 punkta nobīde. Vienai lapai tāds brīnums parādījās, tā arī neizkodu kāpēc, vienkārši sākumā izmantoju !important hacku, vēlāk uzliku pilnu fona attēlu, jo lapai nevajadzēja izmantot mainīgu izmēru.

 

Par css hackiem var apskatīties šeit: http://www.webdevout.net/css-hacks, nu un arī pa google.

Link to comment
Share on other sites

Maris-S , pirmkārt, tu esi vienīgaiks kurš no komentētajiem ieminējās par pozicioniešanu.

Otrkārt, ir jābūt debīlam lai citus uz w3schools mācīties sūtītu.

Treškārt, ja tu neesi ar IE6 neko darījis, tad varbūt nevajadzētu pukstēt.

 

 

Anyway. 99.99% gadījumu position: abs/rel izmantošanas ir vissliktākais variants, kā jebko izdarīt iekš css.

Link to comment
Share on other sites

Mefisto, izlasi uzmanīgi visus postus, es neesmu vienīgais, kas ieminējās par pozicionēšanu.

Ja sauc mani par debilu par to ka es norādīju linku uz w3schools, tad lūdzu dari to pilnīgi ar visiem, kas rāda atsauces uz w3schools (būs daudz debīlo), pie tam es nekur neminēju ka tagad ir jāmācās tikai šeit, šī mājas lapa vispār nekad nav bijusi paredzēta, lai no tās mācītos, tā ir vairāk kā rokas grāmata, kur var ieskatīties, ja ko aizmirst, pie tam ļoti plaši izmantojama, jau vien pa googles prioritātei to var pateikt un Renathy arī rakstīja ka nav vairs iesācēja, tāpēc arī nemeklēju viņai iesācēju mācību materiālu, ja viņa tomēr nevarēs tikt galā, tad pajautās.

Ja Tu apgalvo ka IE6 nav nekādu problēmu, tad drīzāk Tu pats ar viņu neko neesi darījis.

 

Kas ir tik neizmērāmi slikts pozicionēšanai? Ja to pareizi pielieto un pārbauda rezultātu, nav absolūti nekā tajā slikta. Pastāsti, kā Tu bez pozicionēšanas novietosi kādu elementu iekš cita elementa, lai tas būtu vienmēr apakšā un, lai nevajadzētu par to domāt turpmāk, kad ārējais elements mainīs izmēru: tieši norādot tam garumu un platumu, pārlūka izmēru maiņas dēļ, vai satura ietekmē? Kā Tu domā izveidot kaut vai normālu drop down menu, modālo logu, pārvietojamo lodziņu bez pozicionēšanas? Tavs norādītais 99.9% ir pārspīlēts, pie tam ļoti stipri pārspīlēts. Ja jau kritizē, tad arī parādi alternatīvas.

Edited by Maris-S
Link to comment
Share on other sites

Jā , es tiešām uzskatu visus, kas citus sūta uz w3skolu par debīliem.

Jo alternetīva būtu "ļauni" ... neredzu citus iemeslus, lai kādu apzināti sūtītu uz kļūdainu un novecojušu lapu

( tas ir zinātniski pierādīts =P )

 

Kas attiecas uz pozicionēšanu, granted, priekš menu un visādiem js brīnumiem tas ir lietojams,

bet lapas pamat-izkārtojumu ar to NEDRĪKST veidot.

 

Un nē, es nevaru iedot alternatīvu, jo renathy nav atbildējusi, vai lapa ir fiksēta platuma vai staipīga.

Link to comment
Share on other sites

Jā, viņa nav atbildējusi, bet es Tev to nejautāju sakarā ar viņas dizainu, bet sakarā ar Tavu izteicienu '99.9%', ja jau pozicionēšanu izmantojot visi paliek par stulbiem, tad lūdzu parādi gudru alternatīvu. Es tad varēšu to turpmāk izmantot mainīga izmēra dizainam. Pie tam es jautāju kā novietot apakšā (tātad mainīgs augstums) un lapas augstums jau nu noteikti mainīsies lielākajā daļā mājas lapu, domāju tas būs arī Renathy lapai (tieši mainīgs augstums es domāju, nevis vajadzība apakšā novietot kādu objektu, bet tas nemaina lietas būtību). Es varu Tev pateikt alternatīvu, to var izdarīt kaut vai ar iekļautajiem diviem un background-image (ja nepatīk pozicionēšana), bet tas derēs ne vienmēr un tas jau nu noteikti nav tas pareizākais un ērtākais variants. Pieļauju ka arī ir kaudze citu pieeju, bet neko ērtāku par pozicionēšanu es pagaidām neesmu atradis, vienkārši jāiemācās tā pielietot un jāpārbauda visos izplatītākajos pārlūkos. Pie tam nav jau atšķirība ko kāds izmanto, katrs dara kā viņam ir ērtāk, bet ja visi pārējie varianti ir stulbi, debili un nelietojami, tad varētu arī norādīt savas pareizās pieejas web dizaina izvietošanā.

 

Kādas ir kritiskās kļūdas un kas ir tik novecojis w3schools mājas lapā, kas pilnīgi liedz to izmantot? Atkal apgalvojumi bez zinātniskajiem pierādījumiem. Starp citu, norādi tad arī kādu resursu kurā nav nevienas kļūdas.

Link to comment
Share on other sites

Cik lasīju inetā, pamat layoutu iesaka taisīt ar div-iem, izmantojot float opcijas + pozicionēšanu (minimāli absolute, vairāk relative). + vēl gandrīz vienmēr ir opcija - clear... Iepriekšējie komentāri man kkā sajauca galvu - kā tad var bez pozicionēšanas???

 

Šeit ir tagad precīzāk, to ko man vajaga - Bilde

 

Negaidu komentārus par krāsu salikumu, jo tas tagad nav būtiski...

 

Kā arī, protams, negaidu, ka man tagad uzrakstīs gatavu kodu, man nav jorprojām skaidri principi:

- kā dabūt to kreisā stūra bildi daļēji caurspīdīgu

- kā dabūt noapaļotu stūri,

- tālāk jau arī vēl nesaprotu kā tos Block-us iekš contnta taisīt, bet vispirms gribu tikt galā ar ārējiem div-iem).

 

Par to vai lapa ir fiksēta vai ne (ja pareizi saprotu), tad - nav. (ja samazina logu, tad pats vidējais content wrapperis piebīdās pie kreisās malas un tā kreisā fona "kolonna" it kā sašaurinās...)

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...