一、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. python,redis简单订阅

    python连接redis import redis r =redis.Redis(host='192.168.199.11',port = 6379 ,db = 0) r.publish('chan ...

  2. spring util命名空间

    在spring的配置文件中util命名空间类似于java.util包类对应,util命名空间提供了集合相关的配置,在使用命名空间前要导入util命名空间,如下: util命名空间引入 <bean ...

  3. IOS 特定于设备的开发：获取和使用设备姿势（通过手机方向控制3d物体显示）

    利用设备的机载陀螺仪可以实现,当你旋转手机屏幕时,里面的画面不会随着视图更新而移动,以平衡物理运动. 下面例子利用少量简单的几何变换执行该操作.他建立一个运动管理器,订阅设备运动更新,然后基于运动管理 ...

  4. vs 2013下自定义ASP.net MVC 5/Web API 2 模板（T4 视图模板/控制器模板）

    vs 2013下自定义ASP.net MVC 5/Web API 2  模板(T4 视图模板/控制器模板): Customizing ASP.NET MVC 5/Web API 2 Scaffoldi ...

  5. pl sql 无法解析指定的连接标识符

        使用PLSQL Developer时,“ORA-12154: TNS:无法解析指定的连接标识符”问题的一个解决办法< xmlnamespace prefix ="o" ...

  6. 安装64位Oracle 10g超详细教程

    安装64位Oracle 10g超详细教程 1. 安装准备阶段 1.1 安装Oracle环境 经过上一篇博文的过程,已经完成了对Linux系统的安装,本例使用X-Manager来实现与Linux系统的连 ...

  7. android小知识之自定义通知（toast）

    Toast是较为熟悉的通知,但默认方式比较单调,可以根据自己的需求自定义,在统一UI风格的时候可以单独拿出来做一个工具类来使用. 下面我在Fragment中定义的一个按键弹出自定义Toast,在Act ...

  8. Qt信息隐藏(Q_D/Q_Q)介绍——从二进制兼容讲起

    http://www.cnblogs.com/SkylineSoft/articles/2046404.html

  9. perl lwp get uft-8和gbk

    gbk编码: jrhmpt01:/root/lwp# cat x2.pl use LWP::UserAgent; use DBI; $user="root"; $passwd='R ...

  10. Maven 添加Jetty

        <build>         <finalName>springmvc</finalName>         <plugins>       ...