定位布局:

  相对定位:相对于自身的位置进行偏移position需要搭配left right top bottom      position: relative;

  绝对定位:相对于有position属性的父元素定位,如果父元素没有position属性就会再向上找父元素,最后一直找到body元素  position: absolute;

  固定定位:position: fixed;

隐藏溢出内容:

  hidden内容溢出div就隐藏      overflow: hidden;

  scroIl内容溢出添加滚动条      overflow: hidden;

块状元素转内联元素:

  block:块状; inline:内联元素; inline -block:内联块状的结合     display: block;内联元素转块状

  inline-block:可以设置宽高,不独占一行     none :隐藏

css3:  

  translate(x轴,y轴): 移动      transform: trans late(20px, 50px);

  rotate (顺时针旋转度数):旋转      transform: rotate(200deg) ; 

CSS学习第三天的更多相关文章

  1. CSS学习笔记三:自定义单选框,复选框,开关

    一点一点学习CCS,这次学习了如何自定义单选框,复选框以及开关. 一.单选框 1.先写好body里面的样式,先写几个框 <body> <div class="radio-1 ...

  2. HTML/CSS学习之 三列布局,其中左侧和右侧的部分宽度固定,中间部分宽度随浏览器宽度的变化而自适应变化

    第一种方法:绝对定位 <!DOCTYPE html> <html> <head> <title>三列布局</title> <link ...

  3. css学习笔记三

    总结一下水平居中和垂直居中的方法,欢迎交流指正,共同进步! 1.水平居中 1.1):行内元素水平居中,在其父类设置text-align:center; 1.2): 块级元素水平居中有三种 第一种:定宽 ...

  4. css学习の第三弹—盒模型的创建和使用

    一.css盒模型: 元素分类: 块状元素.内联元素(又叫行内元素)和内联块状元素. >>常用的块状元素有: <div>.<p>.<h1>...<h ...

  5. CSS学习(三)

    CSS 分组 和 嵌套 选择器 分组选择器 h1,h2,p { color:green; } 嵌套选择器 <!DOCTYPE html> <html> <head> ...

  6. CSS学习(三)特指度和层叠

    一.特指度 特制度的一般形式是0,0,0,0 行内样式,第一位的特指度加一 id选择符,第二位的特指度加一 类选择符.属性选择符.伪类,第三位的特指度加一 元素选择符.伪元素,第四位的特指度加一 特指 ...

  7. CSS学习笔记之基本介绍

    1.简介 层叠样式表(Cascading Style Sheets,CSS)允许我们把样式设置存储在文件中,从而将内容与表现分离 当同一个 HTML 元素被不只一个样式定义时,最终的样式确定顺序如下( ...

  8. css学习归纳总结(三) 转

    原文地址:css学习归纳总结(三) 为文档添加样式的三种方法 行内样式 行内样式是写在HTML标签的style属性里的,比如: <p style="font-size: 12px;fo ...

  9. html css的简单学习(三)

    html css的简单学习(三) 前端开发工具:Dreamweaver.Hbuilder.WebStorm.Sublime.PhpStorm...=========================== ...

随机推荐

  1. bzoj1742[Usaco2005 nov]Grazing on the Run 边跑边吃草*&&bzoj3074[Usaco2013 Mar]The Cow Run*

    bzoj1742[Usaco2005 nov]Grazing on the Run 边跑边吃草 bzoj3074[Usaco2013 Mar]The Cow Run 题意: 数轴上有n棵草,牛初始在L ...

  2. Linux桌面进化史

    自 20 世纪 90 年代初期以来,Linux 桌面也已从简单的窗口管理器发展为成熟.完整的桌面.那么它究竟是如何一步步发展至今的呢?作为从 1993 年就开始使用 Linux 的资深用户,FreeD ...

  3. “我放弃了年薪20W的offer......”

    我的职业生涯开始和大多数测试人一样,开始接触都是纯功能界面测试.那时候在一家电商公司做测试,做了有一段时间,熟悉产品的业务流程以及熟练测试工作流程规范之后,效率提高了,工作比较轻松,也得到了更好的机会 ...

  4. kubernetes系列(十七) - 通过helm安装dashboard详细教程

    1. 前提条件 2. 配置https证书为secret 3. dashboard安装 3.1 helm拉取dashboard的chart 3.2 配置dashboard的chart包配置 3.3 he ...

  5. Oracle RMAN 异机恢复一例

    背景介绍:本例需求是将NBU备份的oracle数据库恢复到另一主机上. NBU环境配置.异机上的Oracle软件安装配置忽略,下面只介绍OracleDB恢复的过程. ----------------- ...

  6. Zabbix4.x如何安全传输数据

    由于设备都在混合云,所以不少数据传输是通过公网,这样极大的增加了危险性,所以在Zabbix数据传输这块则进行PSK安全认证,由proxy主动收集agent数据后统一发送给server,这样只需要对pr ...

  7. 写给.NET开发者的Python教程(二):基本类型和变量

    从本文开始,我们就要正式了解Python的语法特性了,这章主要介绍基本类型和变量,开始之前先介绍下Python中的标准输入输出. 标准输入输出 前文举过TwoSum问题的例子,但是没有讲到标准输入输出 ...

  8. Shell基本语法---函数

    函数 函数定义 function 函数名 () { 指令... return n } 函数调用及参数传递 function func() { echo "第零个参数:" $ #脚本 ...

  9. 题解 洛谷 P3639 【[APIO2013]道路费用 】

    不难想到可以\(2^k\)去枚举\(k\)条新边的选择方案,然后加入原图中的边来使图连通,用当前方案的收益去更新答案,但是这样复杂度过不去. 可以先把\(k\)条新边都连上,然后再加入边权从小到大排序 ...

  10. C#计算数组的算术平均数、几何平均数、调和平均数、平方平均数和中位数

    1.函数实现 0)打印数组 /// <summary> /// 打印数组 /// </summary> /// <param name="arr"&g ...