HTML&CSS基础-display和visibility

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　作者：尹正杰

版权声明：原创作品，谢绝转载！否则将追究法律责任。

一.HTML源代码

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>display和visibility</title>

        <style type="text/css">

            a{

                /**

                 *     将一个内联元素变成块元素:

                 *         通过dispaly样式可以修改元素的类型,虽然有多个可用参数，但常用参数就以下几个:

                 *             none:

                 *                 不显示元素，并且元素不会再页面中继续占有位置

                 *             inline:

                 *                 可以将一个元素作为内联元素显示

                 *             block:

                 *                 可以将一个元素设置块元素显示

                 *             inline-block:

                 *                 将一个元素转换为行内块元素,可以使一个元素既有行内元素的特点又有行内元素的特点，和img的功能有点像。

                 *         除了上面的几个常用参数外，CSS还设置了其它属性，我这里就不一一去试了，感兴趣的小伙伴可以查阅官网手册。

                 *

                 *

                 */

                display:inline-block;

                width: 300px;

                height: 300px;

                background-color: yellow;

            }

            .box{

                width: 200px;

                height: 200px;

                background-color: red;

                /**

                 *     display: none;

                 *         使用该方式隐藏的元素，不会在页面中显示，并且不再占据页面的位置

                 */

                /*display: none;*/

                /**

                 *     规定元素属性是否可见:

                 *         使用visibility属性可以规定元素是否可见，虽然有4个可用参数，但常用的参数就以下两个:

                 *             visible:

                 *                 默认值，元素是可见的

                 *              hidden;

                 *                 使用该方式隐藏的元素虽然不会再页面中显示，但是它的位置会依然保持哟~

                 */

                visibility: hidden;

            }

        </style>

    </head>

    <body>

        <div class="box"></div>

        <a href="#">我是一个超链接</a>

        <span>我是一个P标签</span>

    </body>

</html>

二.浏览器打开以上代码渲染结果

模拟生成环境的MySQL安装方法-通用二进制方式安装的更多相关文章

  1. Linux下通用二进制方式安装MySQL

    1.下载glibc版本的MySQL: https://downloads.mysql.com/archives/community/ 2.查看mysql用户和mysql组是否存在(用户和组的信息存在/ ...

  2. 基于通用二进制方式安装MySQL-5.7.24(比源码安装MySQL快许多)及破密码

    确保系统中有依赖的libaio软件 yum -y install libaio 使用wget命令下载mysql-5.7.24软件包 wget http://mirrors.sohu.com/mysql ...

  3. CentOS8.1操作系下使用通用二进制包安装MySQL8.0(实践整理自MySQL官方)

    写在前的的话: 在IT技术日新月异的今天,老司机也可能在看似熟悉的道路上翻车,甚至是大型翻车现场!自己一个人开车过去翻个车不可怕,可怕的是带着整个团队甚至是整个公司一起翻车山崖下,解决办法就是:新出现 ...

  4. Mysql 通用二进制包安装

    通用二进制包安装 注意:这里有严格的平台问题: 使用时:centos5.5版本   (类似Windows下的绿色包) 下载(mirrors.sohu.com/mysql)   直接使用tar 解压到指 ...

  5. mysql 8 windows 版本zip方式安装步骤

    mysql 8 windows 版本zip方式安装步骤(下载地址:https://dev.mysql.com/downloads/mysql/)1,解压ZIP文件到指定目录下:如D:\mysql-8. ...

  6. Cloudera Manager安装之利用parcels方式安装3或4节点集群（包含最新稳定版本或指定版本的安装）（添加服务）（CentOS6.5）（五）

    参考博客 Cloudera Manager安装之利用parcels方式安装单节点集群  Cloudera Manager安装之Cloudera Manager 5.3.X安装(三)(tar方式.rpm ...

  7. Cloudera Manager安装之利用parcels方式安装单节点集群（包含最新稳定版本或指定版本的安装）（添加服务）（CentOS6.5）（四）

    不多说,直接上干货! 福利 => 每天都推送 欢迎大家,关注微信扫码并加入我的4个微信公众号:   大数据躺过的坑      Java从入门到架构师      人工智能躺过的坑          ...

  8. CentOS 6 自定义单实例 二进制方式 安装mariadb-5.5.59

    系统平台: CentOS release 6.9 (Final) 内核 2.6.32-696.el6.x86_64 1.去官网下载适合的二进制包 http://mariadb.org/ mariadb ...

  9. 二进制方式安装docker（非root用户启动docker）

    二进制方式安装docker(非root用户启动docker) 一.下载安装包: 地址:https://download.docker.com/linux/static/stable/x86_64/ 这 ...

随机推荐

  1. 洛咕 P4491 [HAOI2018]染色

    显然颜色数量不会超过\(lim=\min(m,n/S)\) 考虑容斥,计算恰好出现了\(S\)次的颜色有至少\(i\)种的方案数\(f[i]\),钦定\(i\)种颜色正好放\(S\)种 有\(m\)种 ...

  2. 命令行模式和python交互模式

    一.命令行模式 在Windows开始菜单选择“命令提示符”,就进入到命令行模式,它的提示符类似C:>:. 二.Python交互模式 在命令行模式下敲命令python,就看到类似如下的一堆文本输出 ...

  3. Redux系列01：从一个简单例子了解action、store、reducer

    其实,redux的核心概念就是store.action.reducer,从调用关系来看如下所示 store.dispatch(action) --> reducer(state, action) ...

  4. JQ_五星级评分特效

    代码如下:<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" conte ...

  5. OpenGL学习（2）——绘制三角形

    在创建窗口的基础上,添加代码实现三角形的绘制. 声明和定义变量 在屏幕上绘制一个三角形需要的变量有: 三角形的三个顶点坐标: Vertex Buffer Object 将顶点数据存储在GPU的内存中: ...

  6. Apache Ignite 学习笔记(二): Ignite Java Thin Client

    前一篇文章,我们介绍了如何安装部署Ignite集群,并且尝试了用REST和SQL客户端连接集群进行了缓存和数据库的操作.现在我们就来写点代码,用Ignite的Java thin client来连接集群 ...

  7. 2017中国人工智能公司榜单发布，颠覆AT的AI独角兽全在这

    每年12月,创业邦研究中心评选并报道“中国创新成长企业100强”,这个榜单我们已经连续做了8年,是中国最有潜力的创业新贵榜,受到了业内广泛认可.从2015年开始我们发现,人工智能上榜企业明显增多,20 ...

  8. idea 使用教程

    最智能的IDE IDEA相对于eclipse来说最大的优点就是它比eclipse聪明.聪明到什么程度呢?我们先来看几个简单的例子. 智能提示重构代码 如果你写的代码过于复杂,或者有更好的方式来替代你写 ...

  9. TAC队--团队选题报告

    The Art of Code--团队选题报告 一个APP项目能否被大众所接受,能否拥有受众,the most important是它的idea. 一个好的idea可以为项目带来巨大的改变 一个 独特 ...

  10. 第15周-反射与JSP

    1. 本周学习总结 以你喜欢的方式(思维导图或其他)归纳总结多数据库相关内容. 2. 书面作业 1. 网页制作 1.1 制作一个网页index.html,内有字体<FONT>.链接< ...