การออกแบบส่วนต่อประสานการจัดการแบ็กเอนด์ของเว็บไซต์คือการสร้างฐานข้อมูลและเฉพาะในกรณีที่เสร็จสิ้น หากฐานข้อมูลไม่ได้ถูกสร้างขึ้นส่วนการเชื่อมต่อจะถูกตั้งค่าให้ว่างเปล่าก่อนและฟังก์ชั่นไม่สามารถเสร็จสิ้นได้ในแง่ของการขนย้ายหน้าเว็บ วันนี้งานเสร็จเร็วมากดังนั้นฉันจึงเขียนโค้ดด้วยตัวเองและฉันก็ใช้ตัวอย่างภาพพื้นหลังหน้าเมื่อฉันเรียนอยู่ หากคุณต้องการตั้งค่าสถานที่ที่มีบุคลิกคุณสามารถใช้โลโก้ของเว็บไซต์ของคุณเองเพื่อกำหนดสไตล์ของคุณเอง
- <! doctypehtmlpublic-// w3c // dtdxhtml1.0transitional // enhttp: //www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd>
- <htmlxmlns = http: //www.w3.org/1999/xhtml>
- <head>
- <metahttp-equiv = content-typecontent = text/html; charset = gb2312/>
- <title> อินเตอร์เฟสเข้าสู่ระบบแบ็กเอนด์ </title>
- <styleType = text/css>
- -
- .งาน{
- ขนาดตัวอักษร: 32px;
- สี:#FF6600;
- Padding-Top: 180px;
- -
- ร่างกาย{
- พื้นหลังสี:#336699;
- -
- ร่างกาย{
- พื้นหลังสี: #CCCCFF;
- ภาพพื้นหลัง: URL (รูปภาพ/2.jpg);
- -
- .STYLE1 {
- ขนาดตัวอักษร: 18px;
- Font-Weight: ตัวหนา;
- -
- .รูปร่าง{
- Padding-Top: 280px;
- Padding-Right: 50px;
- Padding-Left: 600px;
- -
- .STYLE2 {สี: #FFCCFF}
- -
- </style>
- </head>
- <body>
- <formMethod = postaction = class = form>
- <TableWidth = 280Border = 0Align = Center>
- <tr>
- <tdwidth = 87Align = centervalign = middlebackground = images/1.jpg> <divalign = rightclass = style1>
- <divalign = ขวา> ชื่อผู้ใช้: </div>
- </div> </td>
- <tdwidth = 183background = ภาพ/1.jpgbgcolor =#ccffff> <spanclass = style2>
- <label>
- <inputName = nameType = textId = namemaxLength = 10/>
- </lable>
- </span> </td>
- </tr>
- <tr>
- <tdHeight = 37Align = centerValign = middlebackground = images/1.jpg> <divalign = ขวา> <spanclass = style1> รหัสผ่าน </span>: </div> </td>
- <tdbackground = images/1.jpgbgcolor =#ccffff> <spanclass = style2>
- <label>
- <inputName = pwdType = passwordId = pwdMaxLength = 20/>
- </lable>
- </span> </td>
- </tr>
- <tr>
- <tdalign = centervalign = middlebackground = images/1.jpg> <label>
- <divalign = center>
- <inputType = submitName = submentValue = submit/ subment/
- </div>
- </label> </td>
- <tdbackground = images/1.jpgbgcolor =#ccffff> <spanclass = style2>
- <label>
- </span>
- <divalign = centerclass = style2>
- <inputName = RESETTYPE = RESETID = RESETVALUE = RESET/>
- </div>
- <spanclass = style2>
- </lable>
- </span> </td>
- </tr>
- </table>
- </form>
- </body>
- </html>
หากคุณมีความเชี่ยวชาญใน CSS+DIV ในแบบฟอร์มอย่าใช้แท็กตาราง หากคุณทำรหัสอาจมีขนาดใหญ่และจะส่งผลกระทบต่อความเร็ว
ภาพด้านล่างเป็นผลลัพธ์หลังจากเรียกใช้รหัสด้านบน