关于 静态页面布局 中的一些BUG】的更多相关文章

作为一枚初级程序猿,难免在制作静态页面时会遇到一些BUG,在此,我从网上找了一些资料并且结合自己的项目开发经验,总结了一些在静态页面布局时可能会遇到的问题,希望能对初级程序猿有一定的帮助(资料请参考:http://blog.csdn.net/sir1241/article/details/52259405),本文在此基础上有所扩展和详述: 1.<img>标签被<div>包裹时,你会发现<img>图片下会有一条缝隙 原因分析:<img>是一个特殊的标签,它属于…
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Document</title></head><body>    <h2>2.在HTML页面布局中,position的值有几种,默然的值是什么?</h2>    <p>static, rel…
本文转载自:http://www.topcss.org/?p=94,有修改. 负数给人总是一种消极.否定.拒绝之感,不过有时利用负margin可以达到奇妙的效果,今天就表一表负值在页面布局中的应用.这里说的负值主要指的是负margin. 关于负margin的原理建议大家看看这篇文章:http://www.cnblogs.com/2050/archive/2012/08/13/2636467.html#2457812 本文不讲原理,主要展示几个应用. 一.左右列固定,中间列自适应布局 此例适用于左…
静态页面HTML中标签的优化 (2010-04-03 20:54:06) 标签: 电脑 name 罗马数字 css 表单 杂谈 分类: 网页制作 从网上看了一篇关于静态页面中标签优化的问题,感觉还不错,所以就将它转到了自己博客里. 1.h1的合理使用,这个标签是对优化最有作用的一个了.<h1>到<h6>表示标题的6个级别-重要性从高到低,如果在设计网页过程中,你觉得它的默认外观不好看,可以通过 css轻松设置你想要的样式.2. <table> 里面不常用的一些标签:&l…
在html中通过"?"传值--------<a href="index2.html?name=caoy">静态传值</a> 在跳转到的页面index2.html中接收----var name=UrlParm.parm("name"); 代码如下: index.html: <script type="text/javascript"  src="js/getUrlParam.js"…
关于行内元素: 行内元素设置width无效, height无效(可以设置line-height), margin上下无效,padding上下无效,margin和padding可设置左右.   text-align:center的测试: .text-align{text-align:center;} <div class="text-align"> <p>jdif</p> <img src="images/pic1.jpg"&…
http://www.w3school.com.cn/tiy/t.asp 预览工具 一.左右列固定,中间列自适应布局 此例适用于左右栏宽度固定,中间栏宽度自适应的布局.由于网页的主体部分一般在中间,很多网页都需要中间列优先加载,而这种布局刚好满足此需求. <!DOCTYPE html> <html> <head> <style> body{ margin:0; padding:0; min-width:600px; } .main{ float:left;…
有关margin的原理可以看看这篇文章:http://www.cnblogs.com/2050/archive/2012/08/13/2636467.html#2457812 有关margin负值的几个案例可以参考:http://www.cnblogs.com/jscode/archive/2012/08/28/2660078.html 主要有以下几种情况: 一.左右列固定,中间列自适应布局 : 此例适用于左右栏宽度固定,中间栏宽度自适应的布局.由于网页的主体部分一般在中间,很多网页都需要中间列…
关于负margin的原理建议大家看看这篇文章:http://www.cnblogs.com/2050/archive/2012/08/13/2636467.html#2457812 一. 左右列固定,中间列自适应布局 此例适用于左右栏宽度固定,中间栏宽度自适应的布局.由于网页的主体部分一般在中间,很多网页都需要中间列优先加载,而这种布局刚好满足此需求. HTML : CSS: 效果: 二. 去除列表右边框 为了美观通常为每个列表之间设置一定的间距(margin-right),当父元素的宽度固定式…
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> &…
首先给出DOM结构 <divclass="box"> <divclass="box-left"></div> <divclass="box-right"></div></div> 1.利用float + margin实现 .box { height: 200px; } .box > div { height: 100%; } .box-left { width: 200…
学习前端有一段时间了,一直在看书上的理论知识,而实战项目却很少.师兄常说,想要知道自己的实力有多少,知识掌握了多少,最好的方法就是去实践了,实践出真知嘛.于是决定在这个假期里,主要是通过项目的实践以及理论知识的辅助来提高代码水平.首先是做几个HTML5+CSS3静态页面布局的练习,查缺补漏知识点并且总结在实践过程中遇到的一些错误.页面的设计稿主要是网络上找来了的,也尝试自己切图.测量位置.获得内容的属性等等,假装自己真的在完成一个项目. 第一个页面是从设计达人这个平台上找来的,这个平台的页面设计…
一.前言 文章成体系,如果有不明白的地方请查看前面的文章. 二.目录 1.创建页面布局 2.首次使用页面布局 3.修改页面布局 4.使用页面布局 5.最终效果 1.创建页面布局 (1)打开设计管理器,并点击[创建页面布局]如下图所示: (2)填写名称.内容类型.选择母版页,如下图所示: (3)发布主要版本,如下图所示: 此时,包含有“欢迎页面”内容类型的页面布局创建完毕. 2.首次使用页面布局 (1)打开首页,点击[页面]更换页面布局,如下图所示: (2)修改内容并发布,如下图所示: (3)效果…
导航绝对是页面布局中最常见的,为了不用每次去写,稍微贴个简单的导航模版出来,方便以后使用. <title>CSS菜单</title> <style type="text/css"> *{margin:0px;padding:0px;font-size:12px;} #nav li{float:left; list-style:none;} #nav li a{color:#;text-decoration:none;display:block;wid…
1     母板页的应用和layout(页面布局)的创建和应用 母板页上传:将准备好的html和样式 通过spd中的导入方式导入模版html, 导入后: 然后在网站设置中进行转换为母板页.  随后编辑母板页.html就等于编辑了母板页.master. 修改完成后签入 并发布 随后 在站点设置中 在上一步骤签入发布后, demo自然在下拉框中出来了. 选中. 最后 在页面布局中新建  新的页面布局,自然就会带上母板页的格式!…
本篇博文,主要就讲定位的问题,也就是页面布局里最重要的,本篇博文不出意外的话,也是css的最后一篇博文了 定位,position属性 定位有三种: 相对定位 绝对定位 固定定位 相对定位,position:relative 相对定位的意思就是相对于自身元素原来的位置定位 设置相对定位之后,才可以使用四个方向的属性: top.bottom.left.right 相对定位的特性: 不脱标 形影分离 依旧占原来的位 作用: 微调元素位置 做绝对定位的参考(父相子绝)绝对定位会说到此内容. 参考点: 自…
IW 对 TFrame(还是之前那个), 这在页面布局中很有用. 如果多个页面都有一个共同的部分(譬如页眉.页脚.菜单.边栏等), 可以将这些共同的部分放在一个 TFrame 中, 从而方便统一与修改. IW 也对 TMainMenu 提供了支持, 本例就做一个共享的菜单吧. 新建工程后, 添加一个 New Frame: 新建的 TIWFrame1 中, 已自动添加了一个 IWFrameRegion(TIWRegion), 先选一下 IWFrameRegion(控件要放在它上面); 然后分别添加…
今天做办公用品管理系统时,发现需要用到在一个静态页面html 中调用多个静态页面html的内容.查找资料总结了以下一些方法: 一.iframe引入的方法 代码如下: <!-- 部门--> <div class="tab-pane fade in active" id="depart"> <IFRAME SRC="comAdmin_basic_depart.html" frameborder="0"…
11.312 盒子模型 HTML文档中的每个元素都被比喻成矩形盒子, 盒子模型通过四个边界来描述:margin(外边距),border(边框),padding(内填充),content(内容区域),如果把一个盒子比喻成一个壁挂相片,那么 外边距margin ===== 一个相框与另外一个相框之间的距离 边框border ====== 边框指的就是相框 内边距padding ===== 相片与边框的距离 宽度width/高度height ===== 指定可以存放相片的区域 1.css显示模式:块级…
4 课程详情页面静态化 4.1 静态页面测试 4.1.1 页面内容组成 我们在编写一个页面时需要知道哪些信息是静态信息,哪些信息为动态信息,下图是页面的设计图: 打开静态页面,观察每部分的内容. 红色表示动态信息,红色以外表示静态信息. 红色动态信息:表示一个按钮,根据用户的登录状态.课程的购买状态显示按钮的名称及按钮的事件. 包括以下信息内容: 1.课程信息 课程标题.价格.课程等级.授课模式.课程图片.课程介绍.课程目录. 2.课程统计信息 课程时长.评分.收藏人数 3.教育机构信息 公司名…
一.前言 文章成体系,如果有不明白的地方请查看前面的文章. 二.目录 1.创建页面布局 2.首次使用页面布局 3.修改页面布局 4.使用页面布局 5.最终效果 1.创建页面布局 (1)打开设计管理器,并点击[创建页面布局]如下图所示: (2)填写名称.内容类型.选择母版页,如下图所示: (3)发布主要版本,如下图所示: 此时,包含有“欢迎页面”内容类型的页面布局创建完毕. 2.首次使用页面布局 (1)打开首页,点击[页面]更换页面布局,如下图所示: (2)修改内容并发布,如下图所示: (3)效果…
1.布局规划 1.1 网格 网格系统是设计师在切分布局时作为参照的一组行和列. 1.2 布局辅助类 类名用于为布局添加样式.为了让样式可以重用,让类名表达其意图. .column { /* 一般列的样式 */ } .column-half { /* 占列宽的一半 */ } .row { /* 一般行的样式 */ } 另一种做法: .thing, .other-thing, .third-thing, .fourth-thing { /* 这里共用的样式 */ } 命名规范是高质量代码的重要组成部…
今天在Visual Studio 2012中将页面布局打包到网站定义中. 新建Module “MasterPageGallary” 在Element中如下: <Elements xmlns="http://schemas.microsoft.com/sharepoint/"> <Module Name="MasterPageGallary" List="116" Url="_catalogs/masterpage&qu…
通过使用静态单元格的列表,我们可以很方便的进行页面布局.下面通过一个“添加任务页面”来进行演示. 效果图如下: 实现步骤: 1,在storyboard中拖入一个TableViewController,同时创建一个对应的类(MyTabelViewController.swift)进行绑定. 2,选择表格,在属性面板中设置Content为Static Cells,Sections设置为2 3,选中第1个Sections,将Rows设置为1,并拖入一个TextFiled到单元格中 4,选中第2个Sec…
续上篇: 一. 有点内容的静态页面 rails new 命令创建了一个布局文件, 不过现在最好不用.我们重命名这个文件: $ mv app/views/layouts/application.html.erb layout_file # 临时改动 注:在真实的应用中你不需要这么做,不过没有这个文件能让你更好地理解它的作用. 注:关于表题所需变动的部分 1. 添加标题 添加标题之前,我们要知道网页的一般结构,如下图所示: 我们要使用 assert_select 方法分别为app/views/sta…
如何在ASP.NET Web站点中统一页面布局[Creating a Consistent Layout in ASP.NET Web Pages(Razor) Sites] 一.布局页面介绍[About Layout Pages] 很多网站有些内容需要显示在各个页面中,比如Header,Footer或者告诉用户已经登录的部分.ASP.NET允许你创建一个单独的文件来包含文本.标签和代码的内容块,从而搭建一个风格整齐的网站.接下来你就可以将这个内容块插入到任何你想要让它展示的页面中.采用这种方法…
HTML页面中加入代码 <script type="text/javascript" src="http://www.域名.com/js.php?id=tjyd"></script> js.php代码: <?php //js加载静态页面 输出到页面中 $id = trim($_GET['id']); $file = 'iframe/'.$id.'.html'; if(file_exists($file)){ //echo '22'; $…
MVC在生成项目的时候会生成的WEB-INF底下.这个文件夹下面的文件是受保护的,都会走MVC的流程, 但是我希望在WebContent底下可以使用静态页面, 那么需要进入springmvc-servlet.xml 页面,加上一句话:  <mvc:resources mapping="/**"  location="/**" /> 这样,使用mvc:resources标签,可以将根目录下的文件全部定义为静态html,直接访问即可. 需要放到文件夹中: &…
关于在Asp.Net中动态页面转静态页面的方法网上比较多.结合实际的需求,我在网上找了一些源代码,并作修改.现在把修改后的代码以及说明写一下. 一个是一个页面转换的类,该类通过静态函数Changfile()来实现,动态页面到静态页面的转换. using System; using System.Data; using System.Configuration; using System.Web; using System.Web.Security; using System.Web.UI; us…
当站点中集成ServiceStack.RabbitMQ时快速处理异步请求时,官方建议初始化如下: public class AppHost : AppHostHttpListenerBase { public AppHost() : base("Rabbit MQ Test Host", typeof(HelloService).Assembly) {} public override void Configure(Container container) { container.Re…