CSS的display、hover、overflow、©(版权符号)、borer-radius(边框圆角)
一、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、©(版权符号)、borer-radius(边框圆角)的更多相关文章
- CSS 3D旋转 hover 后设置transform 是相对于正常位置
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 前端(七)—— 盒模型之display、overflow、隐藏、border、margin、样式支持,层级结构
display.overflow.隐藏.border.margin.样式支持,层级结构 一.盒模型之display 1.三种样式 block 块 inline 内联/行内 inline-block 内 ...
- CSS之创意hover效果
一.发送效果 HTML <div id="send-btn"> <button> // 这里是一个svg的占位 Send </button> & ...
- CSS深入理解之overflow
CSS深入理解之overflow 前言 这是跟着张鑫旭重学CSS的overflow篇 基本属性 overflow有以下五个基本属性: 1.visible : 默认值,具体表现为,应用此属性后,子元素超 ...
- CSS的display属性
网页设计中最常用的标签p.div.h1-h6(默认为块级元素),span(默认为内联元素) 内联,内嵌,行内属性标签: 1.默认同行可以继续跟同类型标签: 2.内容撑开宽度 3.不支持宽高 4.不支持 ...
- css pre如果同时运用了css的border-radius、 overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡
pre如果同时运用了css的border-radius. overflow两个属性且标签中内容太多时,外部div滚动条在firefox下滚动时很卡. 解决方法:去掉css中border-radius. ...
- css之display:inline-block布局
css之display:inline-block布局 更好的排版-->查看原文 1.解释一下display的几个常用的属性值,inline , block, inline-block ●inli ...
- 在css中使用hover来控制其他元素的样式,该两个元素必须是父子元素
.col-3:hover .check-box { display: block; } 在css中使用hover来控制其他元素的样式,该两个元素必须是父子元素!!!!
- css之display:inline-block布局--转
css之使用display:inline-block来布局 css之display:inline-block布局 1.解释一下display的几个常用的属性值,inline , block, in ...
随机推荐
- 通过class类来实例化其他类的对象(使用有参构造函数)
import java.lang.reflect.Constructor; import java.lang.reflect.InvocationTargetException; class Pers ...
- php以fastCGI的方式运行在iis下,遇到的文件系统权限问题及解决方法
今天准备将一个php demo放在IIS下运行,网站在IIS下的配置是这样的: 应用程序池是集成模式下的.net framework 2.0(2.0或4.0没什么关系,因为php以fastCGI的方式 ...
- codeforces 149E . Martian Strings kmp
题目链接 给一个字符串s, n个字符串str. 令tmp为s中不重叠的两个连续子串合起来的结果, 顺序不能改变.问tmp能形成n个字符串中的几个. 初始将一个数组dp赋值为-1. 对str做kmp, ...
- sqlplus conn远程连接
oracle.install.responseFileVersion=/oracle/install/rspfmt_dbinstall_response_schema_v11_2_0oracle.in ...
- IOS框架概览
iOS是执行在iPhone.iPod Touch或iPad上的操作系统,之前叫做iPhone OS,iOS与Mac OS X有共同的基础架构和底层技术.但iOS是依据移动设备的特点而设计的,所以和Ma ...
- Ubuntu_16.04 配置 Apache Rwrite URL 重写
Ubuntu Apache配置Rwrite URL重写 0. apache目录
- 【原创】移除RX filters在C118上面
» 作者:LSX » 原创文章版权归作者所有,未经作者同意请保留以下声明. » 本文链接:http://blog.lishixin.net/?p=1318 » 转载请注明来源:LSX·Blog » & ...
- 解决iOS7中UITableView在使用autolayout时layoutSubviews方法导致的crash
近期公司项目上线后,出现了大量的crash,发生在iOS7系统上,和UITableView相关: Auto Layout still required after executing -layoutS ...
- 浅谈Struts2(二)
一.struts2的跳转 1.action跳转JSP a.默认为forward <action name="action1" class="com.liquidxu ...
- CodeForces 447C DZY Loves Sequences DP
题目:click here 题意:求给定序列更改其中一个元素后的最长连续上升子序列的长度 分析:最长的连续子序列有2种,一种是严格上升(没有更改元素)的长度加1,一种是两段严格上升的加起来. #inc ...