定位布局:

  相对定位:相对于自身的位置进行偏移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. ASP.NET Core3.1使用Identity Server4建立Authorization Server-2

    前言 建立Web Api项目 在同一个解决方案下建立一个Web Api项目IdentityServer4.WebApi,然后修改Web Api的launchSettings.json.参考第一节,当然 ...

  2. QSignalMapper的使用和使用场景

    目录 QSignalMapper的使用和使用场景 常见场景 下面是参考.可看可不看 这篇写的不错,搬运为Markdown了 可以看一下 参考 QSignalMapper的使用和使用场景 QSignal ...

  3. Python Ethical Hacking - MODIFYING DATA IN HTTP LAYER(1)

    MODIFYING DATA IN HTTP LAYER Edit requests/responses. Replace download requests. Inject code(html/Ja ...

  4. 【揭秘】C语言类型转换时发生了什么?

    ID:技术让梦想更伟大 作者:李肖遥 链接:https://mp.weixin.qq.com/s/ZFf3imVaJgeesuhl1Kn9sQ 在C语言中,数据类型指的是用于声明不同类型的变量或函数的 ...

  5. java-把生成的随机数,指定范围(如:100-200),指定打印次数(如:50次),并进行去重。

    package main.demo; public class Demo4 { /** * 随机指定范围内N个不重复的数 * 最简单最基本的方法 * @param min 指定范围最小值 * @par ...

  6. 高效C++:设计与声明

    C++软件开发可以理解为设计一系列的类,让这些类相互使用,最终实现我们所需要的功能.类与类之间的相互关系可以很复杂,也可以很简单,如何简单高效的描述类与类之间的关系是设计的难点之一.遵循本文所提供的方 ...

  7. C++语法小记---类型检测

    类型检测 C++使用typeid关键字进行类型检查 不同的编译器使用typeid返回的类型名称不严格一致,需要特别注意 也可以使用虚函数,返回各自的类型名 如果typeid的操作数不是类类型(类指针也 ...

  8. 用windbg查看dmp文件,定位bug位置

    windbg + .dmp + .pdb + 源代码,可以看到是哪个代码崩溃的 设置符号文件所在路径 File->Symbol File Path... 在输入框中填入.pdb文件所在的文件夹路 ...

  9. Thymeleaf从入门到精通

    什么是Thymeleaf 大家好,我是bigsai,今天我们来学习Thymeleaf,如果你对Thymeleaf比较陌生也不要紧,它很容易学习与理解,并有着自己鲜明的特色. 开始之前,我们依旧问一个问 ...

  10. intellij IDEA导入maven项目

    一.导入maven项目 1.打开intellij idea,点击File(如下图1),然后点击Open(如下图2)