ASP.NET HyperLink вместо LinkButton - как избежать границы вокруг изображения?

У меня есть веб-сайт ASP.NET, который содержит некоторые ImageButton элементы управления, которые вызывают обратную передачу, используемую для фильтрации списка продуктов по определенным группам продуктов.

ImageButton был создан примерно так:

ImageButton _myImageButton = new ImageButton();
_myImageButton.ImageUrl = PicturePath + PictureName;
_myImageButton.Attributes.Add("border", "0");
_myImageButton.OnClick += handleImageButtonClick();
Controls.Add(_myImageButton);

Теперь я перехожу на ASP.NET 4.0 с оптимизированными для SEO путями, такими как /products/category/item, и использую маршрутизацию с веб-формами для сопоставления URL-адресов с веб-формами. В процессе я хочу заменить свои кнопки изображения элементами управления гиперссылками, показывающими изображение, чтобы я мог связать навигационный URL-адрес с каждым изображением.

Я создаю гиперссылку на новое изображение примерно так:

HyperLink _myImageLink = new HyperLink();
_myImageLink.ImageUrl = PicturePath + PictureName;
_myImageLink.NavigateUrl = "/products/category/" + itemName;
_myImageLink.Attributes.Add("border", "0");
Controls.Add(_myImageLink);

Большая проблема, с которой я столкнулся: ImageButton используется для помещения атрибута border="0" в тег <img> в HTML, чтобы избежать границы вокруг изображения. Но как я могу добиться того же результата, используя элемент управления гиперссылкой?

При текущей настройке border="0" застревает на теге <a href="...."> - и это не совсем то, что мне нужно / нужно.

Любые идеи?? Мысли?? Я уже пробовал элементы .BorderStyle и .BorderWidth класса HyperLink - у меня это не работает (я все еще вижу рамку вокруг своего изображения).

Что мне не хватает? Как я могу достичь своей цели ??


asp.net webforms hyperlink asp.net-4.0 webforms-routing
person marc_s    schedule 01.10.2010    source источник

Ответы (3)


arrow_upward
3
arrow_downward

Этот атрибут не вставляется автоматически в ASP.NET 4.0, потому что он устарел; вместо этого вам следует использовать CSS, чтобы у рассматриваемого тега img не было границы. Одно из возможных предложений - установить его в тегах img внутри тегов a:

a img{
  border: none;
}
person Andrew Barber    schedule 01.10.2010
comment
Это должно быть сделано в теге ‹style› или в таблице стилей, и вы также захотите убедиться, что у вас нет никаких правил CSS, которые могли бы переопределить это и вызвать границу. Наконец, я иногда обнаруживаю, что вместо этого мне нужно определить отсутствие границы с помощью чего-то вроде border: transparent 0; и у меня никогда не было времени, чтобы понять почему. хе - person Andrew Barber; 01.10.2010
comment
Хорошо, это помогло (после хорошего обновления :-) - спасибо за совет! - person marc_s; 01.10.2010

arrow_upward
0
arrow_downward

Кажется, что вы не знаете причину границы.

это только из URL <a>

простой css может исправить это:

a {
  text-decoration: none;
}

или вы можете просто установить text-decoration: none; в своем стиле imageLink

myImageLink.Attributes.Add("style", "text-decoration: none");
person Stefanvds    schedule 01.10.2010
comment
Пытался - и атрибуты отображаются в HTML - но это не решает проблему - изображение все еще имеет рамку вокруг него ... - person marc_s; 01.10.2010

arrow_upward
0
arrow_downward

Вместо того, чтобы устанавливать свойство ImageUrl гиперссылки, почему бы вам не добавить изображение в качестве дочернего элемента гиперссылки, таким образом вы все равно можете установить для него все свойства, которые хотите.

person slugster    schedule 01.10.2010