定位布局:

  相对定位:相对于自身的位置进行偏移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. git的工作区和暂存区

    目录 备注: 知识点 工作区(Working Directory) 版本库(Repository) 备注: 本文参考于廖雪峰老师的博客Git教程.依照其博客进行学习和记录,感谢其无私分享,也欢迎各位查 ...

  2. 使用QtCreator遇到的一些问题

    0. 背景 最近在学习QtCreator(版本:4.8.1:编译器:MSVC 2017 64-bit),遇到了一些问题,特记录如下.( 1. 引用库 QtCreator可以直接包含Windows.h, ...

  3. Redis 分布式锁(一)

    前言 本文力争以最简单的语言,以博主自己对分布式锁的理解,按照自己的语言来描述分布式锁的概念.作用.原理.实现.如有错误,还请各位大佬海涵,恳请指正.分布式锁分两篇来讲解,本篇讲解客户端,下一篇讲解r ...

  4. Intelij DataGrip 的安装和使用

    链接: Intelij DataGrip 安装教程以及汉化教程 Intelij DataGrip 使用教程 以上两个教程已使用过,没有问题 如有侵权请联系删除

  5. 【几何+模拟】二次元变换 计蒜客 - T3213

    题目 aslky 有一个 n×n 的矩形,每个位置上都有一个数,有 q 次操作,每次他会让你上下翻转 (UD),左右反转 (LR),顺时针旋转 90∘(SZ),逆时针旋转 90∘(NZ),请你输出最后 ...

  6. ubuntu DEBIAN_FRONTEND环境变量用法

    DEBIAN_FRONTEND环境变量,告知操作系统应该从哪儿获得用户输入.如果设置为"noninteractive",你就可以直接运行命令,而无需向用户请求输入(所有操作都是非交 ...

  7. Java程序斗地主发牌代码,List、Map集合的应用

    Java集合存储的灵活运用List集合存储 54个编号 Map <key,value> key 对应的是编号 , value 是 牌的花色(红方梅黑)+ 具体的一张牌 ,比如 黑桃2 用2 ...

  8. Python延迟初始化(lazy property)

    转自:https://blog.csdn.net/azsx02/article/details/77649527 Python 对象的延迟初始化是指,当它第一次被创建时才进行初始化,或者保存第一次创建 ...

  9. Glide:重新加载失败的问题

    Glide在url不变,内容改变的时候重新加载还会显示第一张图片, 解决方法: https://blog.csdn.net/u013420865/article/details/53197788?de ...

  10. SpringCloud Bus消息总线简介

    简介: SpringCloud Bus配合SpringCloud Config使用可以实现配置的动态刷新 SpringCloud Bus是用来将分布式系统的节点与轻量级消息系统链接起来的框架,它整合了 ...