(4)在 visual web developer 中使用级联样式表样式

《(4)在 visual web developer 中使用级联样式表样式》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、演练：在VisualWebDeveloper中使用级联样式表样式在本演练的第一部分，将创建可以使用样式的网站和网页。如果已经通过完成演练：在VisualWebDeveloper中创建基本网页在VisualStudio中创建一个网站，则可以使用该网站并转到下一节。否则，按照下面的步骤创建一个新的网站和网页。创建文件系统网站1.打开VisualWebDeveloper。2.在“文件”菜单上单击“新建网站”。出现“新建网站”对话框。3.在“语言”列表中，单击您想使用的编程语言。您选择的编程语言将是网站的默认语言，但您可以为每个页面分别设置编程

2、语言。4.在“VisualStudio已安装的模板”之下单击“ASP.NET网站”。5.在最右边的“位置”框中，键入要保存网站网页的文件夹的名称。例如，键入文件夹名“C:WebSites”。6.单击“确定”。VisualWebDeveloper创建该文件夹和一个名为Default.aspx的新页。添加控件下一步是向页面添加一些控件。代码很简单，但是足够使您稍后添加断点。添加控件1.切换到“设计”视图。2.从工具箱的“标准”组中，将下面的控件拖动到该页上并按以下所示设置其属性。a.Controlb.PropertiesLabelID：C

3、aptionLabelText：（空）TextBoxID：NumberTextboxText：（空）ButtonID：SquareButtonText：SquareLabelID：ResultLabelText：（空）注意对于本演练，页的布局无关紧要。 设置内联样式要将格式应用于页上的单个元素时设置内联样式。VisualWebDeveloper提供了一个功能丰富的编辑器，用于编辑页面上元素的内联样式。在演练的本节中，在“设计”视图和“源”视图中设置样式。在“设计”视图中设置内联样式1.切换到“设计”视图。2.右击“CaptionLabe

4、l”，再单击“样式”。出现“样式生成器”对话框。“样式生成器”将样式信息组织为逻辑类别和为每种样式设置提供适当的值和选项，这样可帮助您设置样式信息。3.单击“字体”、单击“系列”，再单击位于文本框右边的省略号“(...)”。出现“字体选择器”对话框。在“已安装的字体”下单击“Arial”，再单击添加符号（“>>”）。在“选定的字体”下出现“Arial”。4.重复前面的步骤将“TimesNewRoman”和“Verdana”添加到选定字体的列表中，再单击“确定”。返回到“样式生成器”对话框时，三种字体的名称显示在“系列”框中。已创建了字体

5、列表，用于按优先选择的顺序呈现Label控件的内容。1.在“大小”下单击“特定”，在框中键入“1.2”，然后在列表中输入em。通过将大小设置为1.2ems，指示显示的文本将比用户浏览器中当前的字体大小设置大1.2倍。在对话框的底部，可以预览文本的近似外观。2.单击“背景”，单击位于“颜色”框右边的省略号（“…”），在“颜色选取器”对话框中，单击一种颜色。3.单击“确定”关闭StyleBuilder对话框。标签中的文本现在反映所做的样式设置。从这几个步骤中，可以看到样式生成器使您无需知道语法就可以为任何元素设置任何内联样式。如果想直接使用

6、HTML，则还可以在“源”视图中设置样式。在“源”视图中设置内联样式1.切换到“源”视图。“CaptionLabel”控件的元素现在具有反映在样式生成器中所做的设置的style属性。2.将插入点定位在元素的一个空格上，然后键入“style=”。注意无论设置的格式选项是什么，编辑器始终在样式属性两边添加引号。有关更多信息，请参见演练：VisualWebDeveloper中的高级HTML编辑。3.双击“背景色”，然后键入冒号（“:”）。MicrosoftIntelliSense功能显示颜色名称的

7、列表。工具提示显示“背景色”样式设置的语法。4.双击“蓝色”，键入分号（“;”）作为样式设置之间的分隔符，然后按空格键显示IntelliSense功能。5.双击“颜色”，键入冒号（“:”），然后双击一种对比颜色（如“黄色”或“白色”）。6.若要查看所作选择的效果，请切换到“设计”视图。 创建和应用CSS样式表除了为单个元素设置内联样式之外，还可以创建和应用级联样式表(CSS)文件。级联样式表使您可以定义可应用于多个控件和页面的样式，而不必分别编辑元素。在演练的本节中，将创建样式表，该样式表使您可以使用用于设置内联样式的相同工具。然后将样

8、式表应用于正在编辑的页面。创建样式表1.在解决方案资源管理器中，右击网站的名称（如C:WebSites），再单击“添加新项”。2.在“VisualStudio已安装的模板”之下单击“样式表”。3.在“名称