1、border     是边框的意思,它可以设置粗细,多少像素,输入样式,solid是实线的意思,可以直接选择color边框的颜色。

也可以设置某个方向的边框,例如

设置一个div,让它的高和宽都为零

border-bottom:200 px   下边框粗细是200像素

border-left:200 px    左边框粗细也是200像素

border-top:200px     上边框

border-right:200 px   右边框

然后设置它的样式颜色,完全的组合起来就是四个不同颜色的三角形,组合成的正方形

2、设置一个无序列表的div,设置它的样式list-style:none可以去掉无序列表的小点或者是圆

加list-style-image:后面加图片的路径   ,可以把无序列表的点都换成图片

格式与布局

position:absolute;         是绝对定位

position:fixed;固定位置

相对于浏览器的边界

position:relative;相对定位

相对于原来应该出现的位置做改变

在有上面三个的前提上才可以使用top距上边,left距右多少像素,right右边,bottom下边,也可以使用负数

float;left按照指定的方向流,这个是像左流的意思,也可以向别的方像

上段话的样式中如果使用了流的话,在写下段话前加一段话  <div style="clear:both"></div>

z_index:0值越大,越靠上,层级高

其他的

display:none         元素隐藏

display:block         元素显示

display:inline-block  用在span,没办法用高和宽调整大小的

visibility:hidden     隐藏,位置还在

overflow:hidden     超出部分隐藏掉

overflow:scroll       超出部分显示滚动条

css位置相关元素的更多相关文章

  1. 【CSS】定义元素的位置

    CSS定义元素的位置html元素的position属性,有4个属性值,分别是static.relative.fixed.absolute static: 1.默认值,一般不显式设置为static 2. ...

  2. 原生JS获取各种高度宽度、浏览器窗口滚动条的位置、元素的几何尺寸名

    1)关于 pageX, clienX,offsetX,layerX pageX:鼠标在页面上的位置,从页面左上角开始,即是以页面为参考点,不随滑动条移动而变化 clientX:鼠标在页面上可视区域的位 ...

  3. 【2017-03-31】JS-DOM操作:操作属性、彩虹导航栏、定时器、操作内容、创建元素并添加、操作相关元素

    一.操作属性 1.什么是属性: <div class="div" id="div1" style="" ></div> ...

  4. {前端CSS} 语法 Css的几种引入方式 css选择器 选择器的优先级 CSS属性相关 背景属性 边框 CSS盒子模型 清除浮动 overflow溢出属性  定位(position)z-index

    前端CSS CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文 ...

  5. css 属性相关

    css属性相关 宽和高 width属性可以为元素设置宽度, height属性可以为元素设置好高度 块级标签才能设置宽度,内联标签的宽度由内容来决定. 字体属性 文字字体 font-family 可以把 ...

  6. css的伪元素 ::after ::before 和 图标字体的使用

    浅谈css的伪元素::after和::before   css中的::after和::before已经被大量地使用在我们日常开发中了,使用他们可以使我们的文档结构更加简洁.但是很多人对::after和 ...

  7. CSS的相关知识——背景,超链接,列表,表格,奇偶选择器

    接着上一篇总结一些css的相关知识 ㈠背景 背景属性 1.background-color 背景颜色   rgb函数设置 2.background-image   背景图片  url(“logo.jp ...

  8. 浅谈css的伪元素::after和::before

    css中的::after和::before已经被大量地使用在我们日常开发中了,使用他们可以使我们的文档结构更加简洁.但是很多人对::after和::before仍不是特别了解,究竟他们是做什么的?如何 ...

  9. 用 CSS 隐藏页面元素

    用 CSS 隐藏页面元素有许多种方法.你可以将 opacity 设为 0 将 visibility 设为 hidden 将 display 设为 none 将 position 设为 absolute ...

随机推荐

  1. MySQL学习总结(二)数据库以及表的基本操作

    上一节中详细的介绍了关于MySQL数据库的安装过程,接下来我们就该对数据库以及表进行一些基本的操作了. 1.数据类型 MySQL数据库中提供了整数类型.浮点数类型.定点数类型.日期和时间类型.字符串类 ...

  2. 非super user管理会话

    在gp中取消或者中断某个用户的超长时间或者SQL存在问题的会话.假设无法拥有超级用户将无法运行该类操作.   首先我们创建两个用户t1.t2,而且使用t1登录到数据库. [gpadmin@wx60 ~ ...

  3. STL中map错误用法一例

    [GBK]0G's fans( me ) 13:34:26typedef struct _TX_DATA{ int len; unsigned char buff[0x100]; } TX_DATA, ...

  4. Spring mvc注解方式使用事务回滚

    项目名:1ma1ma jdbc.xml <bean  id="dataSource" class="org.apache.commons.dbcp.BasicDat ...

  5. Atitit.404错误解决标准流程and url汉字中文路径404错误resin4 resin chinese char path 404 err解决

    Atitit.404错误解决标准流程and 错误resin4 resin chinese char path 404 err解决 1. #原因解析 1 2. #解决方式 2 3. 输出图片流... 2 ...

  6. ZOJ Problem Set - 2297 Survival 【状压dp】

    题目:ZOJ Problem Set - 2297 Survival 题意:给出一些怪,有两个值,打他花费的血和能够添加的血,然后有一个boss,必须把小怪全部都打死之后才干打boss,血量小于0会死 ...

  7. Linux下恢复误删文件:思路+实践

    周五篮球群里有人问误删文件了怎么恢复,得知是ext4文件系统之后我推荐了ext4magic这个工具,然后又有人提到了xfs的话怎么办,正好前几天看到Dave Chinner在邮件列表里提到了这个问题, ...

  8. ognl概念和原理详解

    一.问题的提出   在mvc中,数据是在各个层次之间进行流转是一个不争的事实.而这种流转,也就会面临一些困境,这些困境,是由于数据在不同世界中的表现形式不同而造成的: 1. 数据在页面上是一个扁平的, ...

  9. hdoj 1272 小希的迷宫 又一个并查集的简单应用

    小希的迷宫 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Submi ...

  10. django 使用post方法出现403错误的解决办法

    当采用客户端象django的服务器提交post请求时.会得到403,权限异常.因为django针对提交的请教,有校验.所以会如此. 解决办法: 导入模块:from django.views.decor ...