如何实现一个三栏自适应布局,左右各100px,中间随着浏览器宽度自适应? 第一个想到的是使用table布局,设置table的宽度为100%,三个td,第1个和第3个固定宽度为100px,那么中间那个就会自适应了,下面是一个实时的demo: 但是table布局是不推荐的,table布局是css流行之前 ...
分类:
Web程序 时间:
2017-04-21 23:05:50
阅读次数:
339
网页布局基础 简介 1.什么是网页布局 网页布局是网页制作的基础,使用DIV+CSS布局网页是基础中的基础。 2.流式布局,浮动布局,绝对定位布局。相关知识点:标准文档流,盒子模型,float属性position属性等。 W3C标准包括结构化标准语言,表现标准语言,行为标准语言,倡导结构,样式,行为 ...
分类:
Web程序 时间:
2017-04-16 16:17:40
阅读次数:
219
CSS 等分网格: 说明:.am-avg-sm-2 数字表示几等分 会将子元素 <li>的宽度设置为 50%。 只能用于 <ul> / <ol> 结构 辅助类: 基本容器: .am-container 水平滚动: .am-scrollable-horizontal 内容超出容器宽度时显示水平滚动条。 ...
分类:
Web程序 时间:
2017-04-12 14:55:59
阅读次数:
369
布局方案 等高布局有几种不同的方法,但目前为止我认为浏览器兼容最好最简便的应该是padding补偿法。首先把列的padding-bottom设为一个足够大的值,再把列的margin-bottom设一个与前面的padding-bottom的正值相抵消的负值,父容器设置超出隐藏,这样子父容器的高度就还是 ...
分类:
Web程序 时间:
2017-04-10 11:34:02
阅读次数:
204
虽然职位说是PHP程序,但实际上什么都要做些,排版当然也免不了了,以前自己做网站时就能排出网页了,但是很多东西不系统,有点走马观花,例如关于这个css布局定位的问题就是,今天特意总结了一下,知识这东西,只有记住了,才是自己的,不能老是再这么查手册,必须记住,而不是理解了就算了。第一关于标准文档流1. ...
分类:
Web程序 时间:
2017-04-08 17:38:25
阅读次数:
218
这篇文章介绍了Flexbox模块所有基本概念,而且是介绍Flexbox模块的很好的一篇文章,所以这篇文章非常的长,你要有所准备。学习Flexbox的曲线@Philip Roberts在Twitter上发了一个推:学习Flexbox可不是件很有趣的事情,因为它将挑战你所知道的CSS布局方面的知识。当然... ...
分类:
其他好文 时间:
2017-04-08 14:50:43
阅读次数:
230
最近在学习前端,所以萌生了对切图的学习,接下来分享下我的学习历程吧~ 1.切图其实并不是直译的就是将图片切开那么简单,那么切图到底是什么意思呢? 切图概念:切图是指将设计稿切成便于制作成页面的图片,并完成html+css布局的静态页面,有利于交互,形成良好的视觉感。通俗来讲,把一张设计图利用到切片工 ...
分类:
其他好文 时间:
2017-04-08 12:45:26
阅读次数:
242
重点记忆:四种结合方式 三种基本选择器 1.CSS:层叠样式表 相当于皮肤 提高了可维护性、样式与内容分离(注释格式/* */) 2.CSS与HTML结合的四种方式:内联式、嵌入式、外部式 1.每个标签上都有一个style【属性】来控制 sytle="key:value;key:value" <di ...
分类:
编程语言 时间:
2017-04-07 22:07:16
阅读次数:
245
做移动端网页,首先必须了解一些基本的概念。 最重要的是了解像素和视口。 我在上一篇文章中已经介绍了像素,这次我们再来谈谈视口。 视口 桌面浏览器中,浏览器窗口就是约束你的css布局视口(又称初始包含块)。它是所有css百分比宽度推算的根源,它的作用是给css布局限制了一个最大宽度,视口的宽度和浏览器 ...
分类:
移动开发 时间:
2017-04-07 21:13:30
阅读次数:
178
都说用DIV+CSS布局来设计网站便于优化,容易被收录,那么你对DIV+CSS布局的用法是否了解?CSS布局是网页html通过DIV标签+CSS样式表代码开发制作的(html)网页的统称。DIV+CSS布局是现在非常流行的布局方法,替代了原来的表格布局。下面我们先来看下学习DIV+CSS布局的基本步 ...
分类:
Web程序 时间:
2017-04-07 12:47:59
阅读次数:
312