مبادئ وضعية العناصر في CSS

الكود:

   h1 {
      position:absolute;
      top: 100px;
      left: 200px;
   }
   

وضعية العناصر المطلقة

الكود:

position

الكود:

   #box1 {
      position:absolute;
      top: 50px;
      left: 50px;
   }

   #box2 {
      position:absolute;
      top: 50px;
      right: 50px;
   }

   #box3 {
      position:absolute;
      bottom: 50px;
      right: 50px;
   }

   #box4 {
      position:absolute;
      bottom: 50px;
      left: 50px;
   }
   

• شاهد المثال
  

وضعية العناصر النسبية

الكود:

position

الكود:

   #dog1 {
      position:relative;
      left: 350px;
      bottom: 150px;
   }
   #dog2 {
      position:relative;
      left: 150px;
      bottom: 500px;
   }

   #dog3 {
      position:relative;
      left: 50px;
      bottom: 700px;
   }