What are the interface design standards for ASP. NET Programming specifications? First
Interface Design Standard for ASP. NET Programming specifications 1. Development Environment Settings:
The screen is set to 800*600/1024*768.
Interface Design Standards for ASP. NET Programming Specifications 2. Interface Design Principles:
Consistent Style
Interface Design Standards for ASP. NET Programming specifications 3. B/S structure development principles:
Use frameworks/templates
Interface Design Standard for ASP. NET Programming specifications 4. Use Table on the page) to set the format.
Settings of the outermost table: width = 778px align = center border = 0
Interface Design Standard for ASP. NET Programming specifications 5. Homepage Body settings:
Bgcolor = "# cccccc"
Interface Design Standard for ASP. NET Programming Specifications 6. Frame Sub-page Body settings:
BottomMargin = "0" leftMargin = "0"
Interface Design Standards for ASP. NET Programming Specifications 7. Alignment:
The text (Label) is right aligned; the numbers (data) are right aligned; the text data is left aligned. If the text is short, the text can be center aligned; the amount must be added with a thousand characters
Interface Design Standard for ASP. NET Programming Specifications 8. The colon must be typed in Chinese Input
Interface Design Standard for ASP. NET Programming Specifications 9. Control usage principles:
Use Html controls as much as possible. You do not need to submit them on the client. You can use Web controls without using Javasrcipt.
Interface Design Standard for ASP. NET Programming Specifications 10.
Controls:
(1) control appearance settings: style.css
I. I link class:
- a:link {font-size: 12px;line-height: 20px;text-decoration: none; color: #666666}
-
- a:visited {font-size: 12px;line-height: 20px;color: #666666;text-decoration:
-
- none;}
-
- a:hover {font-size: 12px;line-height: 20px;color: #FF6600;text-decoration:
-
- underline;}
-
- a:active {font-size: 12px;line-height: 20px;color: #666666;text-decoration:
-
- underline;}
I. ii table Type:
Td {font-size: 12px; line-height: 20px; text-decoration: none ;}
I. iii text box class:
- .inputPM{BORDER-RIGHT: #99ccff 1px solid; BORDER-TOP: #99ccff 1px solid;
-
- BORDER-LEFT: #99ccff 1px solid; BORDER-BOTTOM: #99ccff 1px solid;
-
- HEIGHT: 22px}
I. iv datagrid class:
- . Dg_grid/* Grid-overall */
-
- {Font-size: 12px; border-style: solid; border-width: 2px; border-color: White;
-
- Text-align: center; vertical-align: middle ;}
-
- . Dg_header/* Grid-header */
-
- {Font-weight: bold; color: # E7E7FF; background-color: # 3366CC; text-align: center;
-
- Vertical-align: middle; height: 25px ;}
-
- . Dg_alter/* Grid-alternating rows */
-
- {Background-color: AliceBlue; height: 22px ;}
-
- . Dg_item/* Grid-normal line */
-
- {Color: Black; background-color: WhiteSmoke; height: 22px ;}
-
- . Dg_page/* Grid-page navigation */
-
- {Color: Black; text-align: right; vertical-align: middle; height: 22px ;}
-
- . Dg_select {font-weight: bold; color: White; background-color: # 9471DE ;}/* Grid-select a row */
(2) Some supplements:
Ii. I control data display of datagrid: Text short) center alignment; text long) left alignment; date left alignment; number left alignment; amount left alignment, kilobytes
Ii. ii control text length MaxLength is set according to data structure requirements
Ii. iii because operations are mainly related to databases, the control type can correspond to the field type of the data table. The conventions here are as follows:
◆ When the field type is text or number, the control uses the text box
◆ When the field type is Boolean, the control uses the single choice button checkbox control) or the drop-down box
◆ Field content is selected in a fixed number of values regardless of its type), the control uses the drop-down box
◆ When the field type is date and time, the control can select a date using the text box + button, the button. Value = "...")
◆ Fields are foreign keys of other tables:
A) for basic information, use the drop-down box.
B) if it is not basic information, the control uses the text box + button to jump out of the query window. Click the ". Value ="… "button "..."
◆ The data operation window is generally a DataGrid + input box
A) The DataGrid is used to display data.
B) The input box is used to input/display data.
C) The basic style of the browser window, which displays records in tables. The single table control uses DataGrid, DataList, and Repeater, And the NestedDataGrid for multiple tables.
The Interface Design Standards of ASP. NET Programming specifications are introduced here. I hope you will have some knowledge about the interface design standards of ASP. NET Programming specifications.
- ASP. NET Programming Model HTTP Working Principle
- HTTP protocol analysis of ASP. NET Programming Model
- Analysis on ASP. NET page structure of ASP. NET Programming Model
- ASP. NET Programming Model-ASP. NET page lifecycle Diagram
- Step 11 of ASP. NET Programming Model Page Lifecycle