一、display: none 隐藏 block显示

    visibility：hidden隐藏 visible显示

display:none和visibility:hidden这两个属性对应的值都是隐藏对像，但是它们隐藏对像有点区别。

display和visibility的区别：display隐藏相当于这个元素没有了，visibility的隐藏该元素所占的位置还在，只是内容隐藏了。

二、hover：不是一个样式，用元素的ID或者CLASS之类后面跟冒号hover，代表鼠标放到此元素上显示哪些样式

例如：

三、overflow

可用值

值 描述
visible The content is not clipped. It renders outside the element
内容不会被省掉。会显示在元素的外面
hidden The content is clipped, but the browser does not display a scroll-bar to see the rest of the content 
内容会被省掉，但浏览器不会显示滚动条以用来查看剩余的内容(超出范围隐藏)
scroll The content is clipped, but the browser displays a scroll-bar to see the rest of the content
内容被省掉，但浏览器会显示滚动条以用来查看剩余的内容
auto If the content is clipped, the browser should display a scroll-bar to see the rest of the content
如果内容被省掉了，浏览器才会显示出滚动条

四、borer-radius（边框圆角）

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

#sub1

{

    width:200px;

    height:200px;

    border-radius:15px;

    background-color:#

}

</style>

</head>

<body>

<div id="parent">

    <div id="sub1"></div>

</div>

</body>

CSS的display、hover、overflow、&copy（版权符号）、borer-radius（边框圆角）的更多相关文章

  1. CSS 3D旋转 hover 后设置transform 是相对于正常位置

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 前端（七）—— 盒模型之display、overflow、隐藏、border、margin、样式支持，层级结构

    display.overflow.隐藏.border.margin.样式支持,层级结构 一.盒模型之display 1.三种样式 block 块 inline 内联/行内 inline-block 内 ...

  3. CSS之创意hover效果

    一.发送效果 HTML <div id="send-btn"> <button> // 这里是一个svg的占位 Send </button> & ...

  4. CSS深入理解之overflow

    CSS深入理解之overflow 前言 这是跟着张鑫旭重学CSS的overflow篇 基本属性 overflow有以下五个基本属性: 1.visible : 默认值,具体表现为,应用此属性后,子元素超 ...

  5. CSS的display属性

    网页设计中最常用的标签p.div.h1-h6(默认为块级元素),span(默认为内联元素) 内联,内嵌,行内属性标签: 1.默认同行可以继续跟同类型标签: 2.内容撑开宽度 3.不支持宽高 4.不支持 ...

  6. css pre如果同时运用了css的border-radius、 overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡

    pre如果同时运用了css的border-radius. overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡. 解决方法:去掉css中border-radius. ...

  7. css之display:inline-block布局

    css之display:inline-block布局 更好的排版-->查看原文 1.解释一下display的几个常用的属性值,inline , block, inline-block ●inli ...

  8. 在css中使用hover来控制其他元素的样式，该两个元素必须是父子元素

    .col-3:hover .check-box { display: block; } 在css中使用hover来控制其他元素的样式,该两个元素必须是父子元素!!!!

  9. css之display:inline-block布局--转

    css之使用display:inline-block来布局   css之display:inline-block布局 1.解释一下display的几个常用的属性值,inline , block, in ...

随机推荐

  1. Eclips入门教程

    1. 插件推荐 Eclipse默认情况下是一个纯净版的,所以功能简单,而开源IDE最为强大的莫过于各种插件,通过使用插件可以帮助我们减少大量编写代码的工作量,也帮助我们降低了编写代码的难度,所以懂得安 ...

  2. Qt保证只有一个实例（将CreateMutex得到的handle通过转换得到值）

    使用CreateMutex 可以实现只启动一个应用程序实例 view plaincopy to clipboardprint?#include <QApplication>#include ...

  3. mysql外键使用和级联

    如下面的: create table applicant (id int not null auto_increment primary key, jobId int not null, studen ...

  4. ThinkPHP 3 的输出

    一.ThinkPHP 3 的输出 (重点) a.通过 echo 等PHP原生的输出方式在页面中输出 b.通过display方法输出 想分配变量可以使用assign方法 c.修改左右定界符 休要修改配置 ...

  5. openStack开源云repo db local or on-line 实战部署之Ruiy王者归来

    preface/pre,获取OpenStack核心模块组件及其子组件包(当前仅针对centos6*)及其依赖包 eg,picture

  6. 2015 11 27编写JAVA程序

    在任意文件下 ,建立一个文本文档,更改其txt格式为java格式, 打开此程序的同时打开eclipse可编写代码. public class 文件名{ public static void main( ...

  7. 通过jstack定位在线执行java系统故障_案例1

    问题描写叙述: 在一个在线执行的java web系统中,会定时执行一个FTP上传的任务,结果有一天发现,文件正常生成后却没有上传. 问题初步分析: 1.查看日志文件 发现这个任务仅仅打印了開始进入FT ...

  8. 新浪微博 2.4sdk 一闪而过

    解决方法,保持 ios应用中的 build id和 开放平台中填写的一致

  9. python学习（序章）

    好久没写过笔记了,最近听说写博客笔记能使知识记忆更深刻,于是就开始写写,不为推广,只为增加记忆.好了,开始python的学习: 学习一门语言的快慢,与人无关,主要是与学习的目的有关,python语言目 ...

  10. .NET WIN7+IIS 7.5下URLRewriter组件伪静态设置

    原文地址:WIN7+IIS 7.5伪静态的设置 --------------------------------------------------------偶是分割线君-------------- ...