分别让div浮层靠左靠右和居中

DIV居中:

<div style="margin-left:auto;margin-right:auto;width:760px;background-color:Silver;">
DIV居中 CSS 代码 <a href="http://jihua.cnblogs.com">jihua.cnblogs.com</a>
</div>

DIV靠右：

<div style="margin-left:auto;margin-right:2px;width:760px;background-color:Aqua;">
DIV靠右 CSS 代码 <a href="http://jihua.cnblogs.com">jihua.cnblogs.com</a>
</div>

DIV默认靠左：

<div style="width:760px;background-color:Fuchsia;">
DIV靠左代码 <a href="http://jihua.cnblogs.com">jihua.cnblogs.com</a>
</div>

时间： 2024-10-04 00:10:56

分别让div浮层靠左靠右和居中的相关文章

css实现单行的靠左靠右和居中效果

1.父元素    text-align:center 2.子元素 .left{ float:left; } .right{ float:right; } .center{ display:inline; }

左两行右一行的布局（仅限三个div）

用三个div做一个类似下图的布局: <!DOCTYPE html > <html> <head> <meta charset="utf-8" /> <title>get objects by class</title> <style type="text/css"> div{ background:#ccc} .no1{margin-bottom: 10px;} .no1,.no2{

JS获取鼠标左（右）滑事件

鼠标左(右)滑也是网站开发中常见的效果之一,这里对鼠标左(右)滑做出一些解释. 首先要获取需要左右滑事件的节点: eg: var div=document.getElementById("div"); 然后获取点击事件onmousedown并传参: eg: div.onmousedown=function(e){ } 在函数里写一个闭包来判断左右滑,这里需要获取鼠标的坐标,之后进行判断输出结果 eg: div.onmousedown=function(e){ var a1=e.scre

五中常用简洁后台导航菜单（一级导航，二级导航，手风琴式导航，左或右悬浮式导航，树状导航）

首先附上源码,可以下载! http://yunpan.cn/cd9ivPcL4ayQT (提取码:d8a5) 在建立导航菜单的时候,我们首先布局一个(" 头"+[左,右(自适应)]+”尾“)的HTML页面: 来看一下HTML页面的编写: <div id="container"> <div id="head"></div> <div id="mainContent"> <di

js实现图片加载特效（从左到右，百叶窗，从中间到两边）

/* 网上百度的,感觉”从中间到两边“的效果写的不是很好,改了一下,感觉可以了!*/<html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript"> var image; var in

EasyUI 左，右（上、下）布局

左,右(上.下)布局 <body class="easyui-layout"> <div data-options="region:'west',collapsed:false,title:'合同分类'" style="width:200px"></div> <div data-options="region:'center'"> <div class="easy

前端福利——左滑右滑，绝对是你见过的最简单的写法

上个月使用bootstrap和seajs搭建了前端通用框架,就是为了使代码分块话,js和css直接通过配置就可调用,这样既方便了以后的开发,又方便了效率! 先看下框架图形吧 example就是手机端经常用到的示例 今天就是把我写的左滑右滑分享给大家,先看下图例吧 index.html代码 引用三个js jquery.js swiperhand.js index.js <div id="pagenos"> <span class="myspan" i

使用触摸检测滑动（左，右，上或下）

触摸式滑动是指在特定方向上快速移动手指穿过触摸表面的行为.onswipeJavaScript中目前没有" "事件,这意味着我们可以使用可用的触摸事件来实现一个事件,并且只需在刷卡时定义,即"刷卡". 让我们首先定义何时应该将触摸表面上的移动视为滑动.有在玩两个变量这里-在距离旅行了用户对x或y轴的手指touchstart来 touchend,而且,它花时间.基于这两个因素,我们可以决定该操作是否符合滑动和方向. 有了这个,让我们把想法付诸行动,看看如何检测右键(从左

Vue 封装可向左向右查看图片列表的组件

实现了图片列表展示的功能,一次性可查看4张图,可向左向右点击查看,代码如下: index.vue: <template> <div class="content-container"> <div class="content-container-item content"> <!-- 使用transition加过渡效果 --> <transition-group tag="div" class