第一次布局一个静态网页,发现许多细节都需要自己探索,出现诸如以下问题:

1、布局问题:经常出现一个div被挤出来?做到一半少一个div布局?

布局之前,要点打好框架,明确每个地方的高宽是多少,争取精确到每一像素(是否含有边框像素);但是,在纸上花的草图再好再精确,也需要实际操练。

2、定位问题:明明都定位了,为什么还出现div布局混乱的现象?

(未解)为什么可以通过设置margin-left/right的值为负数可以解决,但是在其他浏览器显示效果仍错误?

3、div中图片的定位,为什么按照理论设定的值,就是到不了应有的位置?

是图片定位错误还是参照物div弄错了?

4、内边距与外边局的问题?

可以分清定义,为什么实际运用时总是得不到应有的效果呢?问题在哪?

5、div中文字的对齐方式、行间距?

对齐方式没问题,行间距怎么调?用line-height么? 字与字的间距怎么调?

6、div中有序列表的应用?

div中的有序列表可以用来做水平和垂直的菜单栏,可以设置边框,但是它前面的点时怎么缩小的?插入图片做序号时,图片与文字如何对齐,为什么会混乱?

文字后面的日期除了用单独的div做,为什么我用<span>标签做出来会自动空一行,原因在哪?

7、为什么做好的静态网页在这个浏览器中就可以正常显示,换了其他浏览器就不可以了呢?

是代码错误还是浏览器兼容问题?

(未完待续。。。)

希望通过实践自己一步步找到答案,而不是记住别人的经验之谈,不去实践。别人的知识可以借鉴,但终究不是自己的。

I hardly stay up before, but now I begin to steal some time form the peaceful night.

关于css+div布局的疑问 2017-03-19的更多相关文章

  1. 回答: 2017-03-19的关于css+div布局的疑问 2017-04-05

    原问题为红色,回答为黑色 第一次布局一个静态网页,发现许多细节都需要自己探索,出现诸如以下问题: 1.布局问题:经常出现一个div被挤出来?做到一半少一个div布局? 布局之前,要点打好框架,明确每个 ...

  2. CSS+DIV布局中absolute和relative区别

    原文:http://developer.51cto.com/art/201009/225201.htm 这里向大家简单介绍一下CSS+DIV布局中absolute和relative属性的用法和区别,定 ...

  3. CSS+DIV布局初练—DIV元素必须成对出现?

    一直做C/S开发的工作,但是很少做和布局相关的工作,往往都是同事将界面设计好,自己填写代码而已,对于B/S的工作,做过,但是很少没有像C/S这么多,界面布局的话,更无从谈起. 日子就这么过,一天一个样 ...

  4. 网站实战 从效果图开始CSS+DIV 布局华为网站

    经过我们的前面css的学习,我们已经分模块的掌握的CSS的技术,但是,要是完整的做一个页面,我们还没有接触过,这次呢,小强老师来和大家完整的利用CSS+DIV做一个网站案例,我们来模仿下华为的网站. ...

  5. CSS:CSS+DIV布局网页

    现代网页布局:CSS+DIV: 一般的网页都是顺序布局的,很难达到我们需要的网页布局格式,此时使用DIV进行分层布局,类似于盒子,对每一部分内容进行设计.这是现在主流的网页布局方式,使用DIV+CSS ...

  6. CSS+DIV布局应用(2015年06月10日)

    Div+css布局应用 一.html元素分类 2.1.顶级元素(Top-level element) 定义 组成html页面最顶级标签 特点 1. 不可设置宽高: 2. 必须在文档流中处于最高级位置: ...

  7. css+div布局案例

    给最外层的div命名一个class 有针对性的进行css布局. <div class="joinus-info"> <div class="form-t ...

  8. 十天学会DIV+CSS(DIV布局)

    一列布局: 一列固定宽度.一列固定宽度居中.一列自适应宽度.一列自适应宽度居中 一列固定宽度 <head> <style type="text/css"> ...

  9. css+div 布局遇到的小常识

    /根目录../上层目录举例如下: 在photo.css文件中写入: div.ls{ background:url(../photo/framels.jpg) no-repeat left; }div. ...

随机推荐

  1. 将 ext_net 连接到 router - 每天5分钟玩转 OpenStack(145)

    上一节完我们创建了外部网络 ext_net,接下来需要将其连接到 Neutron 的虚拟路由器,这样 instance 才能访问外网. 点击菜单 Project -> Network -> ...

  2. <C++Primer>第四版 阅读笔记 第三部分 “类和数据抽象”

    类定义了数据成员和函数成员:数据成员用于存储与该类类型的对象相关联的状态:而函数成员则负责执行赋予数据意义的操作. 第12章 类 一个类可以包含若干公有的.私有的和受保护的部分:在public部分定义 ...

  3. quartz配置时间

    我们需要把log4j的配置文件放入src目录下,启动main类就可以了. Cron Expressions cron的表达式被用来配置CronTrigger实例. cron的表达式是字符串,实际上是由 ...

  4. 论SNAPSHOT包的危害性

    先介绍一下背景:我们应用是一个标准的spring+webx工程,博主在一次项目发布前为了再次测试一下自己的代码,将分支部署到日常环境中,但是项目启动的时候报错: 第一眼看到这个堆栈后有点懵逼 第一是上 ...

  5. Java List集合特有方法程序用法

    package Collection; /* Collection |--List:元素是有序的,元素可以重复.因为该集合体系有索引 | |--ArrayList:底层的数据结构使用的是数组结构 特点 ...

  6. PB程序“无法启动此程序,因为计算机中丢失PBvm90.dll。尝试重新安装该程序以解决此问题”的解决方法

    因为有计算机自考科目,要求使用PB程序做一个管理系统.昨天刚安装好了PB程序,今天使用的时候,当我打开一个PB程序时,出现了"无法启动此程序,因为计算机中丢失PBvm90.dll.尝试重新安 ...

  7. githup教程

    http://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000/瘳雪峰-Git教程http://w ...

  8. eclipse下进行spark开发(已实践)

    开发准备: jdk1.8.45 spark-2.0.0-bin-hadoop2.7(windows下和linux个留一份) Linux系统(centos或其它) spark安装环境 hadoop-2. ...

  9. c++ STL常用算法使用方法

    #include <string> #include <vector> #include <functional> #include <iostream> ...

  10. PrefixHeader.pch' file not found 以及 Xcode 中如何添加pch文件

    在开发的过程中,有时候接触到旧项目,会报: 'PrefixHeader.pch' file not found 的错误! 在Xcode6之前,新建一个工程的时候,系统会帮我们自动新建一个以工程名为名字 ...