ASP.NET小白一個,我想增加一個樣式檔案,讓網頁上的標簽對齊,但是增加了樣式檔案后,發現不起作用,不知道錯在哪里?
1、添加樣式前網頁運行效果圖如下:

2、添加樣式之前的Default.aspx 代碼如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="PartyInvites.Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<h1>New Year's Eve at Jacqui's!</h1>
<p>We're going to have an exciting party. And you're invited!</p>
</div>
<div><label>Your name:</label><input type="text" id="name" /></div>
<div><label>Your email:</label><input type="text" id="email"/></div>
<div><label>Your phone:</label><input type="text" id="phone" /></div>
<div>
<label>Will you attend?</label>
<select id="Willattend">
<option value="">Choose an Option</option>
<option value="https://bbs.csdn.net/topics/true">Yes</option>
<option value="https://bbs.csdn.net/topics/false">No</option>
</select>
</div>
<div>
<button type="submit">Submit RSVP</button>
</div>
</body>
</form>
</html>
3、添加如下樣式檔案 PartyStyles.css
body {
#form1 label{width:120px;display:inline-block;}
#form1 input{margin:2px;margin-left:4px;width:150px;}
#form1 select{margin:2px;width:154px;}
button[type=submit] {margin-top:5px;}
}
4、添加如下樣式檔案 PartyStyles.css后Default.aspx 代碼修正如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="PartyInvites.Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<link rel="stylesheet" type="text/css" href="https://bbs.csdn.net/topics/PartyStyles.css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<h1>New Year's Eve at Jacqui's!</h1>
<p>We're going to have an exciting party. And you're invited!</p>
</div>
<div><label>Your name:</label><input type="text" id="name" /></div>
<div><label>Your email:</label><input type="text" id="email"/></div>
<div><label>Your phone:</label><input type="text" id="phone" /></div>
<div>
<label>Will you attend?</label>
<select id="Willattend">
<option value="">Choose an Option</option>
<option value="https://bbs.csdn.net/topics/true">Yes</option>
<option value="https://bbs.csdn.net/topics/false">No</option>
</select>
</div>
<div>
<button type="submit">Submit RSVP</button>
</div>
</body>
</form>
</html>
5、添加樣式后網頁運行效果圖如下:

uj5u.com熱心網友回復:
4、添加如下樣式檔案 PartyStyles.css后Default.aspx 代碼修正如下:<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="PartyInvites.Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<link rel="stylesheet" type="text/css" href="https://bbs.csdn.net/topics/PartyStyles.css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<h1>New Year's Eve at Jacqui's!</h1>
<p>We're going to have an exciting party. And you're invited!</p>
</div>
<div><label>Your name:</label><input type="text" id="name" /></div>
<div><label>Your email:</label><input type="text" id="email"/></div>
<div><label>Your phone:</label><input type="text" id="phone" /></div>
<div>
<label>Will you attend?</label>
<select id="Willattend">
<option value="">Choose an Option</option>
<option value="https://bbs.csdn.net/topics/true">Yes</option>
<option value="https://bbs.csdn.net/topics/false">No</option>
</select>
</div>
<div>
<button type="submit">Submit RSVP</button>
</div>
</body>
</form>
</html>
uj5u.com熱心網友回復:
原來自己解決了!vs里面有CSS要自己拉出來uj5u.com熱心網友回復:
啥拉出來,你自己沒參考這樣式,自然出不來,除非直接內嵌樣式
uj5u.com熱心網友回復:
參考樣式放在head里,標簽是script。標簽選用樣式是 class不是href。
自己定義的樣式是 標簽的style。
你好好看看樣式的屬性是什么。
uj5u.com熱心網友回復:
專案下的.css檔案拖拽到.aspx的<head></head>標簽內就參考成功了。轉載請註明出處,本文鏈接:https://www.uj5u.com/net/39816.html
標籤:ASP.NET
