IT TIP

ASP.NET 컨트롤에 해당하는 HTML 태그

itqueen 2020. 12. 7. 21:24
반응형

ASP.NET 컨트롤에 해당하는 HTML 태그


HTML 디자이너에게 표준 HTML 태그에 대해 동등한 asp.net 컨트롤을 표시 할 수있는 치트 시트를 찾고 있습니다. 예를 들어 <asp : Panel>은 HTML <div>로 렌더링되고 <asp : Label>은 HTML <span>으로 렌더링됩니다. 나는 이것을 아무 소용이 없도록 인터넷 검색을 해왔다. 누군가가 좋은 치트 시트에 대한 링크를 게시하여이 프로젝트의 디자이너가 aspx 페이지의 마크 업을보다 명확하게 이해할 수 있도록 할 수 있습니까?

명확히하기 위해, 주요 ASP.NET 컨트롤 목록에 대한 링크와 표준 HTML과의 관계에 대한 설명이 필요합니다. 이것이 PDF 형식이거나 읽기 및 인쇄가 쉬운 웹 페이지에 있으면 좋을 것입니다. 제 경우 그 이유는 HTML에 매우 익숙한 PHP 개발자가 프로젝트 작업에 참여하기 때문이며, 가능하다면 표준 ASP.NET 서버 컨트롤을 더 잘 이해하는 것이 유용 할 것이라고 생각합니다. 그런 "치트 시트"를 건네주세요.

주로 .NET 2.0 프레임 워크를 언급하고 있지만 3.0 / 3.5에서도 작업하고 있습니다.


이것은 당신이 말하는 .NEt의 버전과 때때로 컨트롤의 상태에 따라 다르기 때문에 간단한 질문이 아닙니다. 예를 들어 1 및 1.1의 PANEL은 TABLE로 렌더링되는 반면 이후 버전에서는 DIV입니다.

그러나 전반적으로 (2/3의 경우) 다음과 같습니다.

  • 패널-Div
  • 패널-GroupingText = "###"는 Fieldset, Legend입니다.
  • 라벨-스팬
  • 버튼-입력, 유형 버튼
  • 링크 버튼-JS 포스트 백 스크립트가있는 Href
  • 하이퍼 링크-표준 HREF
  • 이미지 버튼-입력, 유형 이미지
  • 텍스트 상자-기본값은 입력, 텍스트 입력
  • 텍스트 상자-모드 = 비밀번호 입력, 비밀번호 입력
  • 텍스트 상자-Mode = Multiline is Textarea
  • DropDownList-선택
  • 목록 상자-선택
  • RadioButton-입력, 그룹 이름이있는 라디오
  • 체크 박스-입력, 체크 박스
  • 반복기 / 목록보기-복잡합니다.
  • Gridview-테이블
  • 테이블-테이블
  • 파일-입력, 유형 = 파일

    그것이 기본입니다. LOGIN 컨트롤과 같은 좀 더 난해한 컨트롤은 그 안에 끝이있을 확률이 많은 테이블입니다.


Stephen 의 목록은 꽤 포괄적입니다. 그래도 다음 메모를 추가하겠습니다.

대부분 알려진 BrowserCaps 에 따라 다릅니다 .

1.x 패널은 IE6 +에서 div로 렌더링되지만 Firefox (또는 기타 "다운 스트림"브라우저에서는 기본적으로 Machine.Config에 세부 정보가 없기 때문에 다운 스트림으로 간주 됨) 단일 셀 테이블로 렌더링됩니다. 이 문제는 Machine.Config 또는 Web.Configs에서 Firefox / Opera / Safari / etc 용으로 업데이트 된 BrowserCaps를 제공하여 해결할 수 있습니다.

또한 제어 어댑터는 출력을 변경할 수 있습니다. 예를 들어 CSS 제어 어댑터 는 대부분의 테이블 제어 (로그인, 등록, 반복기 등)에 대해 스타일이 지정된 div를 출력합니다.

TechEd / PDC에서 ASP.NET 4.0에는 기본적으로 CSS 제어 어댑터가 내장 될 것이라고 발표되었습니다.


이것은 귀하의 질문에 직접적으로 대답하지는 않지만 많은 경우에 일반 HTML 태그에 runat = "server"를 추가하여 ASP.Net이이를 인식하도록 할 수 있습니다. 페이지를 동적으로 변경할 수 있지만 여전히 디자이너가 작업 할 수 있도록하려면 디자이너가 작업을 더 쉽게 할 수 있습니다.

<div id="myDiv" runat="server"></div>
<span id="mySpan" runat="server"></span>

편집하다:

(steve_c가 지적한 바와 같이) 내가 언급하는 것을 잊은 한 가지는 runat = "server"를 추가하면 태그의 ID가 변경되어 약간의 고통이 될 수 있다는 것입니다. CSS에서 ID를 사용하는 경우 운이 좋지 않지만 JavaScript에서 <% = myDiv.ClientID %>와 같은 것을 추가하여 .Net에서 생성 한 ID를 가져올 수 있습니다.


특정 태그를 렌더링해야하는 경우 htmlgenericcontrol이 도움이 될 수 있습니다.


protected void CreateHeaders(List<Group_Info> group_Info)
{
    foreach (Group_Info gi in group_Info)
    {
        HtmlGenericControl groupContainer = new HtmlGenericControl("DIV");
        String lastLableID = "disp" + gi.GroupName.ToString().Replace(" ", "");
        groupContainer.ID = lastLableID;
        groupContainer.Attributes.Add("class", "content-groups");

        HtmlGenericControl groupTitle = new HtmlGenericControl("DIV");
        groupTitle.ID = lastLableID + "Sub1";
        if (gi.GroupName.Trim().Length == 0)
            groupTitle.Attributes.Add("class", "titlebar-hidden");
        else
        {
            groupTitle.Attributes.Add("class", "titlebar");
            groupTitle.InnerText = gi.GroupName.ToString().Trim();
        }

        groupContainer.Controls.Add(groupTitle);

        CreateFields(gi, ref groupContainer);

        this.pageContainer.Controls.Add(groupContainer);
    }
}

참고 URL : https://stackoverflow.com/questions/461901/asp-net-control-to-html-tag-equivalent

반응형