![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTML CSS
文章平均质量分 66
陪你上房揭瓦
这个作者很懒,什么都没留下…
展开
-
position学习 一种让元素上下和左右居中的方式
一 position属性1 absolute绝对定位相对于上一级的父元素进行定位,通过“top”,‘right’,‘bottom’,‘left’进行定位;2 fixed 固定定位相对于浏览器边界进行定位,通过“top”,‘right’,‘bottom’,‘left’进行定位; 3 relative 相对定位相对于该元素本来应该在的位置进行定位,通过“top原创 2016-11-03 19:51:41 · 4038 阅读 · 0 评论 -
CSS实现一侧宽度自适应,一侧为固定宽度
在百度前端技术学院遇到的问题,“页面右侧部分为固定宽度,左侧保持与浏览器窗口变化同步自适应变化”不少网站都是这样的两列式布局,屏幕比较宽,如果全屏只有一列,看起来会比较累;两列式布局,可以让内容一列占较多的空间,并为固定宽度;其他导航或推荐的内容为自适应列;实现方式:固定宽度的一列用position:absolute;定位好;然后自适应的一侧用margin进行定位;#le原创 2016-11-04 14:56:05 · 404 阅读 · 0 评论 -
做练习中学到的和复习的css内容
今下午和晚上做百度前端技术学院第六个题学到的和复习的东西(地址:http://ife.baidu.com/task/detail?taskId=6)1text-delaration属性 none:没装饰underline:下划线overline:上画线line-through:线横穿字2 文字环绕图片(三面)img{ float:left; pa原创 2016-11-04 19:51:52 · 190 阅读 · 0 评论 -
box-sizing:border-boxing;第一次使用
1 当一个div设置box-sizing之前.box { margin-top: 200px; margin-left: 200px; background-color: black; width: 200px; height: 200px; border: 10px solid red; }效果是这样的2 当一个div设置box-sizing之后原创 2016-11-07 14:14:11 · 1876 阅读 · 1 评论 -
flex学习笔记
一 Flexbox布局(Flexible Box)模块旨在提供一个更加有效的方式制定、调整和分布一个容器里的项目布局,即使他们的大小是未知或者是动态的。 二 属性 1 display:flex | inline-flex;(用于父元素) 2 flex-direction(适用于父元素) :row 从左向右排原创 2016-11-07 15:46:00 · 1212 阅读 · 0 评论 -
盒子模型
.box1{ width: 100px; height: 100px; margin: 100px 200px; border: 1px solid red; padding: 100px 200px; } .box2{ width: 100px; height: 100px; margin: 100px 200px;原创 2016-11-15 09:48:26 · 195 阅读 · 0 评论 -
清除浮动
我们常常用于使用了float css样式后产生浮动,最常用是使用clear:both清除浮动。比如一个大对象内有2个小对象使用了css float样式为了避免产生浮动,大对象背景或边框不能正确显示,这个时候我们就需要clear:both清除浮动。1、clear语法:clear : none | left|right| both 2、clear参数值说明:原创 2016-11-15 10:15:34 · 181 阅读 · 0 评论 -
myFocus插件制作焦点轮播图
第一步 引入myFocus 的js文件注意要把你的风格文件放在myFocus库文件目录下的mf-pattern目录内,即可实现自动引入机制。第二步 创建myFocus标准的html结构,并填充你的内容 第三步 在js文件之后调用函数//你可以简单的调用原创 2016-11-15 15:17:13 · 465 阅读 · 0 评论