HTML Tablo Sorunu
-
Selamlar html de tablo yapıyorum ama bir yerde takıldım. Bazı çizgileri silik gösteriyor
<!DOCTYPE html> <html lang="tr"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Baslik</title> <!-- Google Font: Source Sans Pro --> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback"> <!-- Font Awesome --> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp/theme/plugins/fontawesome-free/css/all.min.css"> <!-- daterange picker --> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp/theme/plugins/daterangepicker/daterangepicker.css"> <!-- iCheck for checkboxes and radio inputs --> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp/theme/plugins/icheck-bootstrap/icheck-bootstrap.min.css"> <!-- Bootstrap Color Picker --> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp/theme/plugins/bootstrap-colorpicker/css/bootstrap-colorpicker.min.css"> <!-- Tempusdominus Bootstrap 4 --> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp/theme/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css"> <!-- Select2 --> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp/theme/plugins/select2/css/select2.min.css"> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp/theme/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css"> <!-- Bootstrap4 Duallistbox --> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp/theme/plugins/bootstrap4-duallistbox/bootstrap-duallistbox.min.css"> <!-- BS Stepper --> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp/theme/plugins/bs-stepper/css/bs-stepper.min.css"> <!-- dropzonejs --> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp/theme/plugins/dropzone/min/dropzone.min.css"> <!-- Theme style --> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp/theme/dist/css/adminlte.min.css"> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp/theme/plugins/ekko-lightbox/ekko-lightbox.css"> <link rel="stylesheet" href="https://tasarim.zulfumehmet.com/arp//ist/css/lightbox.min.css"> <script type="https://tasarim.zulfumehmet.com/arp//js/select2.full.min.js"></script> </head> <body> <style> table{ border-collapse: collapse; } table th, table td { /* Multicolored border */ border: 1px solid; border-color: #000 #000 #000 #000; } table th, table td{ /* Added padding for better layout after collapsing */ padding: 4px 8px; } @page { size: A4; } .page-break { page-break-before: always; } </style> <div class="table" id="yazdir"> <br/> <table class="table table-sm" border="1" style="font-size:9px"> <thead> <tr> <td scope="col">Logo</td> <td style="font-size:14px; text-align:center;vertical-align:middle; text-transform: uppercase;" colspan="6">Temel Altİ İşlerİ KONTROL FORMU</td> </tr> </thead> <tr> <td scope="col"><b>Denetim No</b></td> <td colspan="4" scope="col">21</td><td scope="col"><b>Denetim Tarihi</b></td> <td scope="col">0000-00-00 00:00:00</td> </tr> <tr> <td scope="col"><b>KKS Kodu</b></td><td colspan="4" scope="col">DFDFDF</td> <td scope="col"><b>RFI No</b></td><td scope="col">DFDF</td> </tr> <tr> <td scope="col"><b>İşin Tanımı</b></td><td colspan="6" scope="col">dfdfd</td> </tr> <tr> <td scope="col"><b>Kalite Planı</b></td><td colspan="4" scope="col">DFDFDF</td> <td scope="col"><b>Kalite Planı Adım No</b></td><td scope="col">DFDFDF</td> </tr> <tr> <td scope="col"><b>Yapım Metodu</b></td><td colspan="4" scope="col">DFDFDF</td> <td scope="col"><b>Proje Kodu</b></td><td scope="col">DFDF</td> </tr> <tr align="center" style="font-size:9px;"> <th colspan="2" scope="col">Denetim Sırasında Uygulanacak Esaslar</th> <th scope="col" style="writing-mode: vertical-rl; text-orientation: upright;">Evet</th> <th scope="col" style="writing-mode: vertical-rl; text-orientation: upright;">Hayır</th> <th scope="col" style="writing-mode: vertical-rl; text-orientation: upright;">Uygulanmaz</th> <th colspan="2" scope="col">Not</th> </tr> <tbody> <tr> <th colspan="7">A. KAZI VE DOLGU TESLİMATI</th> </tr> <tr> <td colspan="2">1. İş kayıt defteri (jurnal) var mı?</td> <td align="center"><i class="fa fa-check" aria-hidden="true"></i></td> <td align="center"></td> <td align="center"></td> <td colspan="2"></td> </tr> <tr> <td colspan="2">2. İş izni, uygulama projesi, kalite planı, yapım metodu var mı? Güncel mi?</td> <td align="center"><i class="fa fa-check" aria-hidden="true"></i></td> <td align="center"></td> <td align="center"></td> <td colspan="2"></td> </tr> <tr> <td colspan="2">7. Sürme izolasyon kalite planına ve yapım metoduna uygun olarak uygulanmış mı?</td> <td align="center"><i class="fa fa-check" aria-hidden="true"></i></td> <td align="center"></td> <td align="center"></td> <td colspan="2"></td> </tr> <tr> <td colspan="2">8. Su yalıtım membranı bindirme payları yatayda ve dikeyde uygun mu?</td> <td align="center"><i class="fa fa-check" aria-hidden="true"></i></td> <td align="center"></td> <td align="center"></td> <td colspan="2"></td> </tr> <tr> <td colspan="2">9. Su yalıtım membran imalatı, teslimata kadar korunmuş mu?</td> <td align="center"><i class="fa fa-check" aria-hidden="true"></i></td> <td align="center"></td> <td align="center"></td> <td colspan="2"></td> </tr> <tr > <td style="width:10%; border-right:none"> </td> <td style="width:35%;border-left:none;border-right:none;"> </td> <td style="width:5%;border-left:none;border-right:none;"> </td> <td style="width:5%;border-left:none;border-right:none;"> </td> <td style="width:5%;border-left:none;border-right:none;"></td> <td style="width:20%;border-left:none;border-right:none;"> </td> <td style="width:30%;border-left:none"> </td> </tr> <tr> <td colspan="7" ><b>AÇIKLAMALAR:</b> dfdfd </td> </tr> <tr> <td colspan="3"><b>KONTROLÜ YAPAN</B><br><img style="width: 100px;" src="https://tasarim.zulfumehmet.com/arp//img/e-imza.png"><br>Ad Soyad İmza<br></td> <td colspan="4"> <p align="center">Onaylayan<br><img style="width: 100px;" src="https://tasarim.zulfumehmet.com/arp//img/e-imza.png"></p></td> </tr> </tbody> </table> <div class="page-break"></div> <table> <thead> <tr> <th colspan="6">Resimler</th> </tr> </thead> <tbody> <tr> <td colspan="6"> <div class="card-body"> <div class="container"> <div class="row"> <div ><a class="example-image-link" href="https://tasarim.zulfumehmet.com/arp/upload/resim/stf-grup-885892-1684248701.jpg" data-lightbox="example-set" data-title="stf-grup-885892-1684248701.jpg"><img class="card-img-top" style="width: 50%;" src="https://tasarim.zulfumehmet.com/arp/upload/resim/stf-grup-885892-1684248701.jpg" alt=""/></a><br></div> </div> </div> </div> </td> </tr> </tbody> </table> </div> </body> </html>
Örnek kod yukarda
Mesela resimlerde orta çizgiler silik renkte tüm çizgiler siyah renkte olsun istiyorum, nerde yanlış yapıyorum.
-
border: 1px solid blackHatalı çıkan td ve tr lere bunu denedim oldu, takılan olursa belki işine yarar.