VisualStudio使命使用代码实现网页的整体布局?
Visual Studio中想要使用代买设计一个网页的布局,该怎么设计呢?下面我们就来看看详细的教程。
1、打开一个已有的Visual Studio作品,本例为TwoFish网站,网页文件为Default.aspx。
2、在网页中,找到body标签,如下图所示。
3、接着,在下方找到div标签。
4、先输入整体布局的代码,其中id="maincontent"表示设置的是主区域。
5、width表示主区域的宽,height表示主区域的高,本人将两个值都设置为100%。
6、接着,设置对象的位置,用width和height表示对象的宽高范围。
7、margin-left表示对象离左端距离,margin-right为右端距离,margin-top为对象离顶部的距离,本人将它们都设置为auto。
8、最后,设置对象的浮动位置,其中的float表示位置类型为浮动,本人将其值设置为right,即对象以右边为基准设置在窗口中的位置。
9、padding-top表示对象离顶部的浮动距离,padding-left表示对象离左边的浮动距离,padding-right表示对象离右部的浮动距离。
10、一个网站的页面布局已设置好了,接下来,就可以自由的在网页中添加对象了。
编辑网页时,一般要用代码为网页设置整体布局,使用布局可以让网页中的代码更加规整,方便后期的网页制作和维护
以上就是Visual Studio中设计一个网页页面布局的实例教程,希望大家喜欢,请继续关注脚本之家。
相关推荐:
visualstudio怎么删除代码段管理器? vs代码段管理器的移除方法
相关文章
win10开发者套件Visual Studio 2016预览版2发布下载
今天微软发布了win10开发者套件Visual Studio “15”预览版第二个版本并提供了下载,在这个版本中新增众多小功能和Bug修复,详细内容请看下文图文介绍,需要的朋友可以参考2016-05-11Visual Studio 2010怎么使用自带的安装项目打包程序?
Visual Studio 2010怎么使用自带的安装项目打包程序?程序很大,靠别起来很麻烦,但是如果打包起来以后就很方便打包,今天我们就来看看Visual Studio 2010自带的安装项目打2016-05-09- visual studio怎么手动添加工具箱控件?visual studio想添加控件很麻烦,今天我们就来看看visual studio中手动添加工具箱控件的教程,需要的朋友可以参考下2016-04-13
- Visual Studio怎么重新配置开发环境?想把C++的开发环境改为C#的开发环境,该怎么办呢?这时候我们就需要重置我们的设置,下面我们来看看vs重新配置开发环境的详细教程2016-04-10
Visual Studio中无法查找或打开PDB文件怎么办?
Visual Studio中无法查找或打开PDB文件怎么办?在VS底部的“输出”框中提示“无法查找或打开 PDB 文件”,出现这个问题该怎么解决呢?下面我们来看看详细的解决办法,需要2016-03-23- Visual Studio资源管理器怎么修改停靠位置?资源管理器中可以停靠隐藏,但是选择停靠默认是停靠在右边,怎么修改停靠位置呢?下面我们来看看修改的方法,需要的朋友可以参2016-03-08
全新Visual Studio Code预览版0.10.10发布下载
今天微软发布了Visual Studio Code预览版0.10.10,这个版本主要新增了大量功能改进和错误修复,其中,新的源代码折叠功能是非常值得注意的,下面提供官方下载,需要的朋友2016-03-01- Android studio编辑器中的代码怎么显示缩进?使用Android studio软件在编辑程序的时候,想显示代码的缩进功能,能通过线方式来代表是否缩进,显示也较为明显,效果也更佳,2016-02-26
- Visual Studio中怎么创建自己的代码段?如果大家掌握了代码段,输入代码就变得非常简单了。只需要输入cw按两次Tab健就输入成功了,今天我们来看看编辑自己常用的代码段的方2016-02-26
- visual studio 2015离线帮助文档怎么安装?遇到不会的问题经常使用在浏览器中启动帮助功能,但是这个功能有个弊端,就是在不联网的时候不能使用,该怎么安装离线的帮助文档2016-02-18
最新评论