Unelte utilizator

Unelte site


module:11-basic-web-dev:lectie-04

Diferențe

Aici sunt prezentate diferențele dintre versiunile selectate și versiunea curentă a paginii.

Link către această vizualizare comparativă

Both sides previous revision Previous revision
Next revision
Previous revision
module:11-basic-web-dev:lectie-04 [2014/10/03 19:39]
gchelu
module:11-basic-web-dev:lectie-04 [2015/10/17 23:02] (curent)
fbratiloveanu [Rezolvare task-uri]
Linia 54: Linia 54:
  
 <​html>​ <​html>​
-<p data-height="​268"​ data-theme-id="​0"​ data-slug-hash="​lkDeC" data-default-tab="​result"​ data-user="​giac" class='​codepen'>​See the Pen <a href='​http://​codepen.io/​giac/pen/lkDeC/'>lkDeC</a> by Gia (<a href='​http://​codepen.io/​giac'>@giac</a>) on <a href='​http://​codepen.io'>​CodePen</​a>​.</​p>​ +<p data-height="​268"​ data-theme-id="​0"​ data-slug-hash="​ByjQab" data-default-tab="​result"​ data-user="​andreeas" class='​codepen'>​See the Pen <a href='​http://​codepen.io/​andreeas/pen/ByjQab/'>ByjQab</a> by andreea ​(<a href='​http://​codepen.io/​andreeas'>@andreeas</a>) on <a href='​http://​codepen.io'>​CodePen</​a>​.</​p>​ 
-<script async src="//​codepen.io/​assets/​embed/​ei.js"></​script>​+<script async src="//​assets.codepen.io/​assets/​embed/​ei.js"></​script>​
 </​html>​ </​html>​
  
Linia 61: Linia 61:
 Prima imagine plutește la dreapta, a doua imagine plutește la stanga, iar pragraful are valoarea //none// pt **float**. Prima imagine plutește la dreapta, a doua imagine plutește la stanga, iar pragraful are valoarea //none// pt **float**.
  
 +Iată cum arată o structură generală
 +<​html>​
 +<p data-height="​268"​ data-theme-id="​0"​ data-slug-hash="​yInmw"​ data-default-tab="​result"​ data-user="​giac"​ class='​codepen'>​See the Pen <a href='​http://​codepen.io/​giac/​pen/​yInmw/'>​yInmw</​a>​ by Gia (<a href='​http://​codepen.io/​giac'>​@giac</​a>​) on <a href='​http://​codepen.io'>​CodePen</​a>​.</​p>​
 +<script async src="//​codepen.io/​assets/​embed/​ei.js"></​script>​
 +</​html>​
 +
 +
 +
 +==== Task-uri ====
 +
 +Pornind de la structura din [[http://​codepen.io/​anon/​pen/​HKhya|Codepen]] trebuie să ajungeți la următorul rezultat
 +{{:​module:​11-basic-web-dev:​batman-2.png?​800|}}
 +  ​
 +Pentru a realiza acest lucru urmăriți pașii de mai jos:
 +*Modificați lățimea paginii (acum este de 700px care trebuie modificată în 900px).
 +*Mutați conținutul din dreapta în stânga după care adăugați alte 2 content-uri ca în imagine.
 +*Modificati fundalul content-urilor. Ce se întâmplă dacă alegeți culoarea neagră pentru fundal?
 +*Adăugați un text mai mare în contentul din centru după care adăugați și o imagine ca în imaginea de mai sus.
 +*Modificați textul din celelalte content-uri astfel încât să arate ca în imaginea de mai sus.
  
-=== Task-uri === 
-  - mai multe task-uri mai micute de aranjare in pagina a unor figuri sau texte puse in div. 
  
-=== Tema === 
-  - ceva asemanator cu task-urile 
  
-=== Recapitulare === 
-  - tot un task, pornind de la un schelet 
  
module/11-basic-web-dev/lectie-04.1412354362.txt.gz · Ultima modificare: 2014/10/03 19:39 de către gchelu