Bootstrap kullanırken bir CSS sorununa takıldım. Ayrıca Angular UI.bootstrap ile Angular JS kullanıyorum (bu da sorunun bir parçası olabilir).
Verileri bir tabloda görüntüleyen bir web sitesi yapıyorum. Bazen veriler, tablolarda görüntülemem gereken nesneler içeriyor. Bu yüzden, kenarlıksız tablolar için ayırma çizgilerini içeride tutarken normal bir tablonun içine kenarlıksız tablolar koymak istiyorum.
Ancak öyle görünüyor ki, özellikle bir tabloda kenarlıkları göstermemeyi söylesem bile, bu zorlanıyor:
HTML:
<table class='table borderless'>
CSS:
.borderless table {
border-top-style: none;
border-left-style: none;
border-right-style: none;
border-bottom-style: none;
}
Yani burada istediğim şey sadece iç sınırlar.
Kenarlık stili td
öğeleri üzerinde ayarlanır.
html:
<table class='table borderless'>
css:
.borderless td, .borderless th {
border: none;
}
Güncelleme: Bootstrap 4.1'den beri kenarlığı kaldırmak için .table-borderless
kullanabilirsiniz.
https://getbootstrap.com/docs/4.1/content/tables/#borderless-table
.tablesınıfını