定位布局:

  相对定位:相对于自身的位置进行偏移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. 用Python演奏音乐

    目录 背景 准备 安装mingus 下载并配置fluidsynth 下载soundfont文件 分析 乐谱格式 乐谱解析 弹奏音乐 添加伴奏 保存音乐 完整程序 背景 笔者什么乐器也不会,乐理知识也只 ...

  2. bzoj4582[Usaco2016 Open]Diamond Collector

    bzoj4582[Usaco2016 Open]Diamond Collector 题意: n个钻石,每个都有一个大小,现在将其装进2个盒子里,每个盒子里的钻石最大的与最小的大小不能超过k,问最多能装 ...

  3. Nginx/Httpd反代tomcat配置

    在上一篇博客中,我们了解了tomcat的server.xml中各组件的用法和作用:其中对于tomcat连接器来说,它分三类,一类是http连接器,一类是https连接器,一类是ajp连接器:通常tom ...

  4. SDS——重用StringBuilder

    package example.java; /** * @author 杜科 * @description 简单动态字符串,非线程安全.采取类似buffer的设计,使其成为一个可以方便重用的Strin ...

  5. 2020年20个Flutter最漂亮的UI库和项目

    Best-Flutter-UI-Templates 地址:https://github.com/mitesh77/Best-Flutter-UI-Templates The History of Ev ...

  6. static关键字和final关键字

    static关键字和final关键字 static(静态) 作用 用来修饰属性.方法.代码块.内部类 static修饰属性 表示静态变量(类变量) 按是否使用static修饰,属性的分类 静态属性 当 ...

  7. 华为云如何使用二次验证码/虚拟MFA/两步验证/谷歌验证器?

    一般点账户名——设置——安全设置中开通虚拟MFA两步验证 具体步骤见链接  华为云如何使用二次验证码/虚拟MFA/两步验证/谷歌验证器? 二次验证码小程序于谷歌身份验证器APP的优势 1.无需下载ap ...

  8. js用正则表达式查找中文

    var content = "awfjawf测试wfewef"; var ret = /\p{Unified_Ideograph}+/u.exec(content);

  9. DJANGO-天天生鲜项目从0到1-003-用户模块-登录

    本项目基于B站UP主‘神奇的老黄’的教学视频‘天天生鲜Django项目’,视频讲的非常好,推荐新手观看学习 https://www.bilibili.com/video/BV1vt41147K8?p= ...

  10. 分布式锁-Redis方案

    #!/usr/bin/env python # coding=utf-8 import time import redis class RedisLock(object): def __init__( ...