"FrontDownBox" பக்கத்தின் திருத்தங்களுக்கிடையேயான வேறுபாடு

நூலகம் இல் இருந்து
தாவிச் செல்ல:வழிசெலுத்தல், தேடுக
வரிசை 1: வரிசை 1:
−
<html>
+
<html lang="ta">
 
<head>
 
<head>
 
   <meta charset="UTF-8">
 
   <meta charset="UTF-8">
 
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
−
   <title>FrontBoxDown</title>
+
   <title>Noolaham Layout</title>
 
   <style>
 
   <style>
−
     /* Styles for the outermost container */
+
     body {
 +
      background-color: #dfedff;
 +
      font-family: Arial, sans-serif;
 +
    }
 +
 
 
     .outermost-container {
 
     .outermost-container {
 +
      display: grid;
 +
      grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
 +
      gap: 20px;
 +
      padding: 20px;
 +
    }
 +
 +
    .card {
 +
      display: flex;
 +
      align-items: center;
 
       background-color: #dfedff;
 
       background-color: #dfedff;
−
      padding: 1%;
 
 
       border: 1px solid #009de0;
 
       border: 1px solid #009de0;
 +
      border-radius: 12px;
 +
      padding: 20px;
 
     }
 
     }
  
−
    /* Styles for the outer container */
+
     .card img {
−
     .outer-container {
+
       width: 100px;
−
       display: flex;
+
       height: auto;
−
       flex-wrap: wrap; /* Allow boxes to wrap to the next line on smaller screens */
+
       margin-right: 20px;
−
       justify-content: space-between;
 
 
     }
 
     }
  
−
    /* Styles for each box container */
+
     .card-text {
−
     .box-container {
+
       flex: 1;
−
       width: 48%; /* Adjust the width of each container as needed */
+
       text-align: left;
−
       margin-bottom: 20px;
 
−
      position: relative;
 
 
     }
 
     }
  
−
    /* Styles for each inner box */
+
     .title-ta {
−
     .inner-box {
+
       font-weight: bold;
−
       width: 100%;
+
       font-size: 16px;
−
      height: 320px;
+
       margin: 0;
−
       font-size: 30px;
 
−
      background-color: #dfedff;
 
−
      padding: 1%;
 
−
      text-align: center;
 
−
      border-radius: 5px;
 
−
      box-sizing: border-box;
 
−
      cursor: pointer;
 
−
       border: 1px solid #009de0;
 
 
     }
 
     }
  
−
    /* Styles for the box below each inner box */
+
     .title-en {
−
     .additional-box {
+
       font-size: 14px;
−
       position: absolute;
+
       margin: 2px 0 10px 0;
−
      width: 90%;
+
       color: #333;
−
      height: 130px;
 
−
      text-align: center;
 
−
      background-color: #dfedff;
 
−
       margin-top: 5px;
 
−
      margin-bottom: 5px;
 
−
      border-radius: 5px;
 
−
      bottom: 0;
 
−
       left: 5%; /* Adjust the left position */
 
 
     }
 
     }
−
      .responsive-image{
+
 
−
        width: auto;
+
    .description {
−
        height:100px;
+
      font-size: 14px;
 +
      line-height: 1.5;
 +
      color: #111;
 
     }
 
     }
−
    @media screen and (max-width: 768px) {
 
−
      /* Adjustments for mobile devices */
 
  
−
       .box-container {
+
    @media screen and (max-width: 600px) {
−
         width: 100%;
+
       .card {
−
         height: 200px;
+
         flex-direction: column;
−
       
+
         text-align: center;
 
       }
 
       }
−
 
  
−
       .inner-box {
+
       .card img {
−
      width: 100%;
+
         margin: 0 0 10px 0;
−
      height: 200px;
 
−
      font-size: 10px;
 
−
      font-weight: bold;
 
−
    }
 
−
      .additional-box {
 
−
        width: 90%;
 
−
        height:auto;
 
−
        left: 5%;
 
−
         font-size: 10px;
 
−
      }
 
−
      .responsive-image{
 
−
        width: auto;
 
−
        height:40px;
 
−
    }
 
 
       }
 
       }
−
    }
 
−
 
−
      .responsive-image{
 
−
        width: auto;
 
−
        height:100px;
 
 
     }
 
     }
 
   </style>
 
   </style>
வரிசை 94: வரிசை 69:
 
<body>
 
<body>
  
−
<!-- Outermost container -->
 
 
<div class="outermost-container">
 
<div class="outermost-container">
  
−
   <!-- First set of boxes -->
+
   <!-- Box 1 -->
−
   <div class="outer-container">
+
   <div class="card">
−
     <!-- Left inner box with additional box -->
+
     <img src="https://noolaham.org/wiki/images/6/6c/NOOLAHAM-LOGO-PALOODAKAM-JAN2024_01%281%29.png" alt="Noolaham Multimedia">
−
    <div class="box-container">
+
    <div class="card-text">
−
      <div class="inner-box" onclick="openLink()">
+
      <p class="title-ta">பல்லூடக நூலகம்</p>
−
        <img src="https://noolaham.org/wiki/images/6/6c/NOOLAHAM-LOGO-PALOODAKAM-JAN2024_01%281%29.png" class="responsive-image" >
+
       <p class="title-en">Noolaham Multimedia</p>
−
        <p >பல்லூடக நூலகம் <br/> Noolaham Multimedia</p>
+
      <p class="description">புகைப்படங்கள், ஒலி-நிகழ்பட ஆவணங்கள் (Audio-Visual materials), அலுவலக ஆவணங்கள் (சொற்செயலி, அட்டவணை, நிகழ்த்தல்), வலைத்தளங்கள் போன்ற பல்லூடகங்களை பாதுகாத்துப் பகிர்வதற்கான தளம்.</p>
−
       </div>
 
−
      <div class="additional-box"> <br/>
 
−
        <p> புகைப்படங்கள், ஒலி-நிகழ்பட ஆவணங்கள் (Audio-Visual materials), அலுவலக ஆவணங்கள் (சொற்செயலி, அட்டவணை, நிகழ்த்தல்), வலைத்தளங்கள் போன்ற பல்லூடகங்களை பாதுகாத்துப் பகிர்வதற்கான தளம்.
 
−
      </p>
 
−
      </div>
 
 
     </div>
 
     </div>
 +
  </div>
  
−
    <!-- Right inner box with additional box -->
+
  <!-- Box 2 -->
−
    <div class="box-container">
+
  <div class="card">
−
      <div class="inner-box" onclick="openLink2()">
+
    <img src="https://noolaham.org/wiki/images/thumb/2/24/NOOLAHAM-NEW_LOGO-PALLIKOODAM-JAN2024-01_%281%29.png/900px-NOOLAHAM-NEW_LOGO-PALLIKOODAM-JAN2024-01_%281%29.png" alt="Noolaham School">
−
        <img src="https://noolaham.org/wiki/images/thumb/2/24/NOOLAHAM-NEW_LOGO-PALLIKOODAM-JAN2024-01_%281%29.png/900px-NOOLAHAM-NEW_LOGO-PALLIKOODAM-JAN2024-01_%281%29.png" class="responsive-image">
+
    <div class="card-text">
−
        <p >பள்ளிக்கூட நூலகம் <br/>  Noolaham School</p>
+
      <p class="title-ta">பள்ளிக்கூட நூலகம்</p>
−
       </div>
+
       <p class="title-en">Noolaham School</p>
−
      <div class="additional-box"> <br/>
+
      <p class="description">கல்வி சார் முயற்சிகளுக்கு உறுதுணையாக, கற்றல் கற்பித்தற் செயன்முறைகளுடன் தொடர்பான‌ ஆவணங்களைச் சேகரித்து, ஆவணப்படுத்தி இணையம் வழியாக அனைவருக்கும் பயன்தரும் வகையில் வெளியிடும் இணையத் தளம்.</p>
−
 
 
−
        <p> கல்வி சார் முயற்சிகளுக்கு உறுதுணையாக, கற்றல் கற்பித்தற் செயன்முறைகளுடன் தொடர்பான‌ ஆவணங்களைச் சேகரித்து, ஆவணப்படுத்தி இணையம் வழியாக அனைவருக்கும் பயன்தரும் வகையில் வெளியிடும் இணையத் தளம்.  
 
−
      </p>
 
−
      </div>
 
 
     </div>
 
     </div>
 
   </div>
 
   </div>
−
 
−
 
−
  <br>
 
  
−
<!-- Second set of boxes -->
+
  <!-- Box 3 -->
−
   <div class="outer-container">
+
   <div class="card">
−
     <!-- Left inner box with additional box -->
+
     <img src="https://noolaham.org/wiki/images/thumb/e/e9/NOOLAHAM_FOUNDATION-NEW_LOGO-JAN2024-01_%281%29.png/900px-NOOLAHAM_FOUNDATION-NEW_LOGO-JAN2024-01_%281%29.png" alt="Noolaham Foundation">
−
    <div class="box-container">
+
    <div class="card-text">
−
      <div class="inner-box" onclick="openLink3()">
+
      <p class="title-ta">நூலக நிறுவனம்</p>
−
        <img src="https://noolaham.org/wiki/images/thumb/e/e9/NOOLAHAM_FOUNDATION-NEW_LOGO-JAN2024-01_%281%29.png/900px-NOOLAHAM_FOUNDATION-NEW_LOGO-JAN2024-01_%281%29.png" class="responsive-image" >
+
       <p class="title-en">Noolaham Foundation</p>
−
        <p >நூலக நிறுவனம் <br/> Noolaham Foundation </p>
+
      <p class="description">இலங்கைத் தமிழ் பேசும் சமூகங்கள் தொடர்பான ஆவணங்களை எண்ணிமப்படுத்தி ஆவணப்படுத்தி, இலவச மற்றும் திறந்த அணுகல் மூலம் தமிழ் பேசும் சமூகங்கள் தொடர்பான கல்வி, ஆராய்ச்சி மற்றும் மேம்பாட்டு முயற்சிகளை ஆதரிக்கும் நிறுவனம்.</p>
−
       </div>
 
−
      <div class="additional-box"> <br/>
 
−
        <p> இலங்கைத் தமிழ் பேசும் சமூகங்கள் தொடர்பான ஆவணங்களை எண்ணிமப்படுத்தி ஆவணப்படுத்தி, இலவச மற்றும் திறந்த அணுகல் மூலம் தமிழ் பேசும் சமூகங்கள் தொடர்பான கல்வி, ஆராய்ச்சி மற்றும் மேம்பாட்டு முயற்சிகளை ஆதரிக்கும் நிறுவனம்.  
 
−
</p>
 
−
      </div>
 
 
     </div>
 
     </div>
 +
  </div>
  
−
 
+
  <!-- Box 4 -->
−
 
+
  <div class="card">
−
 
+
    <img src="https://noolaham.org/wiki/images/thumb/f/fa/NOOLAHAM-NEW_LOGO-CTNLPR-JAN2024-01_%281%29.png/900px-NOOLAHAM-NEW_LOGO-CTNLPR-JAN2024-01_%281%29.png" alt="Noolaham Tech">
−
    <!-- Right inner box with additional box -->
+
    <div class="card-text">
−
    <div class="box-container">
+
      <p class="title-ta">நூலக நுட்பம்</p>
−
      <div class="inner-box" onclick="openLink4()">
+
       <p class="title-en">Noolaham Tech</p>
−
        <img src="https://noolaham.org/wiki/images/thumb/f/fa/NOOLAHAM-NEW_LOGO-CTNLPR-JAN2024-01_%281%29.png/900px-NOOLAHAM-NEW_LOGO-CTNLPR-JAN2024-01_%281%29.png" class="responsive-image">
+
      <p class="description">தமிழ் மொழியின் நீண்ட ஆயுளுக்கும் முழுமைக்கும் தொழில்நுட்ப மேம்பாடுகளைப் பின்பற்றி இயற்கை மொழி செயலாக்கம் (Natural Language Processing) மற்றும் செயற்கை நுண்ணறிவு (Artificial Intelligence) சார்ந்த ஆய்வுகளை மேற்கொள்ளுதல்.</p>
−
        <p >நூலக நுட்பம் <br/> Noolaham Tech</p>
 
−
       </div>
 
−
      <div class="additional-box"> <br/>
 
−
        <p> தமிழ் மொழியின் நீண்ட ஆயுளுக்கும் முழுமைக்கும் தொழில்நுட்ப மேம்பாடுகளைப் பின்பற்றி இயற்கை மொழி செயலாக்கம் (Natural Language Processing) மற்றும் செயற்கை நுண்ணறிவு (Artificial Intelligence) சார்ந்த ஆய்வுகளை மேற்கொள்ளுதல். </p>
 
−
      </div>
 
 
     </div>
 
     </div>
 
   </div>
 
   </div>
  
 
</div>
 
</div>
−
 
−
<!-- JavaScript to handle the click event and open the link -->
 
−
<script>
 
−
    function openLink() {
 
−
        window.location.href = "http://noolaham.media";
 
−
    }
 
−
 
−
    function openLink2() {
 
−
        window.location.href = "http://noolaham.school";
 
−
    }
 
−
 
−
    function openLink3() {
 
−
        window.location.href = "https://noolaham.foundation";
 
−
    }
 
−
 
−
    function openLink4() {
 
−
        window.location.href = "https://www.noolaham.tech";
 
−
    }
 
−
 
−
</script>
 
  
 
</body>
 
</body>
 
</html>
 
</html>

23:55, 3 செப்டம்பர் 2025 இல் நிலவும் திருத்தம்

Noolaham Layout

Noolaham Multimedia

பல்லூடக நூலகம்

Noolaham Multimedia

புகைப்படங்கள், ஒலி-நிகழ்பட ஆவணங்கள் (Audio-Visual materials), அலுவலக ஆவணங்கள் (சொற்செயலி, அட்டவணை, நிகழ்த்தல்), வலைத்தளங்கள் போன்ற பல்லூடகங்களை பாதுகாத்துப் பகிர்வதற்கான தளம்.

Noolaham School

பள்ளிக்கூட நூலகம்

Noolaham School

கல்வி சார் முயற்சிகளுக்கு உறுதுணையாக, கற்றல் கற்பித்தற் செயன்முறைகளுடன் தொடர்பான‌ ஆவணங்களைச் சேகரித்து, ஆவணப்படுத்தி இணையம் வழியாக அனைவருக்கும் பயன்தரும் வகையில் வெளியிடும் இணையத் தளம்.

Noolaham Foundation

நூலக நிறுவனம்

Noolaham Foundation

இலங்கைத் தமிழ் பேசும் சமூகங்கள் தொடர்பான ஆவணங்களை எண்ணிமப்படுத்தி ஆவணப்படுத்தி, இலவச மற்றும் திறந்த அணுகல் மூலம் தமிழ் பேசும் சமூகங்கள் தொடர்பான கல்வி, ஆராய்ச்சி மற்றும் மேம்பாட்டு முயற்சிகளை ஆதரிக்கும் நிறுவனம்.

Noolaham Tech

நூலக நுட்பம்

Noolaham Tech

தமிழ் மொழியின் நீண்ட ஆயுளுக்கும் முழுமைக்கும் தொழில்நுட்ப மேம்பாடுகளைப் பின்பற்றி இயற்கை மொழி செயலாக்கம் (Natural Language Processing) மற்றும் செயற்கை நுண்ணறிவு (Artificial Intelligence) சார்ந்த ஆய்வுகளை மேற்கொள்ளுதல்.

நூல்கள் [21,773] இதழ்கள் [18,039] பத்திரிகைகள் [72,101] பிரசுரங்கள் [1,501] நினைவு மலர்கள் [2,935] சிறப்பு மலர்கள் [7,552] எழுத்தாளர்கள் [9,600] பதிப்பாளர்கள் [7,713] வெளியீட்டு ஆண்டு [239] குறிச்சொற்கள் [123] வலைவாசல்கள் [25] சுவடியகம் [24] நிறுவனங்கள் [1,939] வாழ்க்கை வரலாறுகள் [3,436]

உங்கள் பங்களிப்புகளுக்கு
"https://noolaham.org/wiki/index.php?title=FrontDownBox&oldid=647034" இருந்து மீள்விக்கப்பட்டது
  • Powered by MediaWiki