1.定位:position:fixed;锁定位置,相当于屏幕位置锁定,不随页面移动。

position:absolute;绝对位置,相对于页面定位,随页面移动。

position:relative;相对位置,相对于页面内周边元素的位置,要注意与周围元素的关系,避免相互排挤。

2.其他属性:z-index:n;该层设置为第n层,三维布局,在z轴方向分层,可理解为摞纸。

float:left;横向左侧排列,横向流式布局,超出边框后自动排在下一行;right 横向右侧排列。

overflow:hidden;超出部分隐藏;scroll 显示出滚动条。

min-width:4px;最小宽度。

border-radius:5px;边框圆角,可填像素或百分比。

box-shadow:5px 5px 5px black;边框阴影:向右 向下 虚化5px 黑色。

text-shadow:5px 5px 5px black;文字阴影:向右 向下 虚化5px 黑色。

transition:0.5s;渐变效果,变化时间为0.5s。

transform:rotate(360deg);旋转360度。

margin-left:10px;向右平移10px。

opacity:0.5;半透明效果,50%透明效果

a:hover {color:red;鼠标指向链接时颜色变为红色;cursor:pointer;鼠标指到上面时的形状;}

css基础:格式与布局的更多相关文章

  1. 一起学HTML基础-格式与布局fixed/absolute/relative/z-index/float

    很多网页都存在一个悬浮的操作条或者广告区,无论如何上下滚动网页,操作条或广告区都不会动,这个就是div制作,位置锁定在屏幕指定位置,现在我们就学习下网页的格式与布局. position 位置,来给di ...

  2. css基础-定位+网页布局案例

    position:static 忽略top/bottom/left/right或者z-index position:relative 设置相对定位的元素不会脱离文档流 position:fixed 不 ...

  3. css基础-2 div布局

    div布局 <html> <head> <title>div布局 </title> <meta charset="utf-8" ...

  4. 关于CSS格式与布局中的基础知识的简单操作

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. css基础 引用方式 标签选择器 优先级 各式布局

    今天讲的css基础,了解了css即层叠式表,是美化网页,控制页面的样式. 样式表引进网页的3种方式1内联式,语法例子:<div style="width: 100px;height: ...

  6. 前端开发:css基础知识之盒模型以及浮动布局。

    前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西?  为什么这个浮动没有效果?  这个问题楼主已经回答了n遍.今天则是把 ...

  7. css样式表 格式与布局

    1 样式表  内联样式表  内嵌样式表  外部样式表 2 选择器 标签选择器 <style type="text\css" class 选择器  以.开头 ID选择器 以#开 ...

  8. css样式表:样式分类,选择器。样式属性,格式与布局

    样式表分类: 1.内联样式表, 和html联合显示,例:<p style="font-size:14px;">内联样式表</p> 2.内嵌样式表 作为一个独 ...

  9. 前端总结·基础篇·CSS(一)布局

    目录 这是<前端总结·基础篇·CSS>系列的第一篇,主要总结一下布局的基础知识. 一.显示(display) 1.1 盒模型(box-model) 1.2 行内元素(inline) &am ...

  10. css样式,边界和边框,格式和布局

    1.大小:width:宽:heigh:高 2.背景:1)background-color:背景颜色 2)background-image:背景图片url路径 3)background-repeat:图 ...

随机推荐

  1. Spring源码情操陶冶-AbstractApplicationContext#registerBeanPostProcessors

    承接前文Spring源码情操陶冶-AbstractApplicationContext#invokeBeanFactoryPostProcessors 瞧瞧官方注释 /** * Instantiate ...

  2. java中方法的参数传递机制

    问:当一个对象被当作参数传递到一个方法后,此方法可改变这个对象的属性,并可返回变化后的结果,那么这里到底是值传递还是引用传递?  答:是值传递.Java 编程语言只有值传递参数.当一个对象实例作为一个 ...

  3. Android学习笔记-Adapter基础讲解

    本节引言 从本节开始我们要讲的UI控件都是跟Adapter(适配器)打交道的,了解并学会使用这个Adapter很重要, Adapter是用来帮助填充数据的中间桥梁,简单点说就是:将各种数据以合适的形式 ...

  4. C++ STL 优先队列详解

    一.解释: 优先队列是队列的一种,不过它可以按照自定义的一种方式(数据的优先级)来对队列中的数据进行动态的排序,每次的push和pop操作,队列都会动态的调整,以达到我们预期的方式来存储. 例如,将元 ...

  5. Java的三种代理模式简述

    本文着重讲述三种代理模式在java代码中如何写出,为保证文章的针对性,暂且不讨论底层实现原理,具体的原理将在下一篇博文中讲述. 代理模式是什么 代理模式是一种设计模式,简单说即是在不改变源码的情况下, ...

  6. FastDFS安装和配置,整合Nginx-1.13.3

    目录: 一:下载FastDFS  二:安装FastDFS 三:配置 四:整合Nginx和FastDFS FastDFS is an open source high performance distr ...

  7. node中使用es6/7/8 --- 支持性与性能

    前言 这几年react.vue的快速发展,越来越多的前端开始讲es6的代码运用在项目中,因为我们可以通过babel进行转译为低版本的js以便于运行在所有浏览器中,import.export.let.箭 ...

  8. 野生程序员对.NETFramework 4.0 ThreadPool的理解

    ThreadPool 类 提供一个线程池,该线程池可用于执行任务.发送工作项.处理异步 I/O.代表其他线程等待以及处理计时器. 命名空间:   System.Threading程序集:  mscor ...

  9. 最短路和次短路问题,dijkstra算法

    /*  *题目大意:  *在一个有向图中,求从s到t两个点之间的最短路和比最短路长1的次短路的条数之和;  *  *算法思想:  *用A*求第K短路,目测会超时,直接在dijkstra算法上求次短路; ...

  10. Oracle 11.2.0.1 ADG环境MRP进程遭遇ORA-600异常终止

    环境:Linux + Oracle 11.2.0.1 ADG 现象:发现备库没有应用日志 1. 数据库查询备库目前状态 发现备库目前没有应用日志,apply lag已经显示备库有3天21小时多没有应用 ...