Jak dodać odstęp między kolumnami w kontrolce GridView

W kontrolce GridView w ASP.NET istnieją dwa właściwości definiujące odstępy: CellPadding oraz CellSpacing. Pierwsza określa odległość pomiędzy zawartością komórki a jej krawędzią, a druga – odległość pomiędzy sąsiadującymi komórkami. Dzięki ich odpowiedniej konfiguracji tabela wygląda bardziej profesjonalnie.

Krok 1 – Dodanie kontrolki

Otwórz nową stronę w Visual Studio. Z Toolbox przeciągnij kontrolkę GridView na stronę. Visual Studio automatycznie wygeneruje niezbędny kod HTML oraz ustawi domyślne wartości właściwości.

Krok 2 – Przejście do trybu kodu

Przejdź do zakładki Code. W tym widoku zobaczysz rzeczywisty znacznik <asp:GridView>. Edycja w trybie kodu daje większą kontrolę niż projektowanie wizualne.

Krok 3 – Znalezienie znacznika

W kodzie znajdź znacznik <asp:GridView …>. Domyślnie właściwości CellPadding i CellSpacing są ustawione na 0.

Krok 4 – Dodanie wypełnienia (padding)

W znaczniku dodaj atrybut CellPadding="5". Przełącz się z powrotem na zakładkę Design – komórki staną się wyższe, a tekst oddzielony od krawędzi.

Krok 5 – Dodanie odstępu między komórkami (spacing)

Wróć do trybu Code i dopisz CellSpacing="5". Po powrocie do widoku projektowego zauważysz większy odstęp pomiędzy poszczególnymi komórkami.

Zapisz plik i uruchom go w przeglądarce (kliknij prawym przyciskiem „View in Browser”). Eksperymentuj ze zmianą wartości CellPadding i CellSpacing, aby uzyskać pożądany wygląd tabeli.