Nginx的基本配置案例
HTML&CSS基础-内联元素的盒模型
作者:尹正杰
版权声明:原创作品,谢绝转载!否则将追究法律责任。
一.HTML源代码
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title>内联元素的盒模型</title>
- <style type="text/css">
- span{
- background-color: red;
- }
- .box1{
- width: 300px;
- height: 300px;
- background-color: yellow;
- }
- .s1{
- /**
- * 内容区:
- * 内联元素不能设置,因为计时设置了也没有任何的效果
- */
- width: 200px;
- height: 300px;
- /**
- * 水平内边距:
- * 内联元素是可以设置水平方向的内边距
- */
- padding-left: 100px;
- padding-right: 100px;
- /**
- * 垂直内边距:
- * 内联元素可以设置垂直方向内边距,但是不会影响页面的布局,只不过显示效果会有所不同而已(它可以把它垂直方向的元素区域给覆盖而不会挤压)。
- */
- padding-top: 50px;
- padding-bottom: 50px;
- /**
- * 边框设置:
- * 内联元素可以设置边框,虽然水平方向是可以影响到页面布局,但是垂直方向依旧是不会影响页面的布局哟~
- */
- border: 50px blue solid;
- /**
- * 水平外边距:
- * 内联元素支持水平方向的外边距
- */
- margin-left: 30px;
- margin-right: 100px;
- /**
- * 垂直外边距:
- * 内联元素不支持垂直外边距
- */
- margin-top: 200px;
- margin-bottom: 200px;
- }
- .s2{
- /**
- * 为右边的元素设置一个左外边距:
- * 水平方向的外边距不会重叠,而是求和。
- */
- margin-left: 100px;
- }
- </style>
- </head>
- <body>
- <span class="s1">我是一个span标签</span>
- <span class="s2">我是一个span标签</span>
- <span >我是一个span标签</span>
- <span >我是一个span标签</span>
- <div class="box1"></div>
- </body>
- </html>
二.浏览器打开以上代码渲染结果
Nginx的基本配置案例的更多相关文章
- Nginx防盗链配置案例配置,Nginx的知识分享
防盗链的含义:网站内容不在自己服务器上,而通过技术手段,绕过别人放广告有利益的最终页,直接在自己的有广告有利益的页面上向最终用户提供此内容. 常常是一些名不见经传的小网站来盗取一些有实力的大网站的地址 ...
- Nginx插件之openresty反向代理和日志滚动配置案例
Nginx插件之openresty反向代理和日志滚动配置案例 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.openresty介绍 1>.Nginx介绍 Nginx是一款 ...
- Nginx动静分离经典案例配置
随着Nginx高性能Web服务器大量被使用,目前Nginx最新稳定版为1.2.6,张宴兄在实际应用中大量使用Nginx,并分享Nginx高性能Web服务器知识,使得Nginx在国内也是飞速的发展.那今 ...
- nginx虚拟主机配置
nginx虚拟主机配置 虚拟主机的概念虚拟主机,就是把一台物理服务器划分成多个"虚拟"的服务器,每一个虚拟主机都可以有独立的域名和独立的目录nginx虚拟主机的配置nginx的 ...
- nginx简介与配置
nginx简介 nginx(发音同engine x)是一款轻量级的Web服务器/反向代理服务器及电子邮件(IMAP/POP3)代理服务器,并在一个BSD-like协议下发行. nginx由俄罗斯的程序 ...
- https和server-status配置案例
https和server-status配置案例 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.https协议 我们知道http协议是明文的,所以,你的数据发送不管是请求报文(r ...
- Flume 高可用配置案例+load balance负载均衡+ 案例:日志的采集及汇总
高可用配置案例 (一).failover故障转移 在完成单点的Flume NG搭建后,下面我们搭建一个高可用的Flume NG集群,架构图如下所示: (1)节点分配 Flume的Agent和Colle ...
- 《nginx 二》深入理解nginx的各项配置
Nginx应用场景 1.http服务器.Nginx是一个http服务可以独立提供http服务.可以做网页静态服务器. 2.虚拟主机.可以实现在一台服务器虚拟出多个网站,例如个人网站使用的虚拟机. 3. ...
- 服务发现之consul理论整理_结合Docker+nginx+Tomcat简单部署案例
目录 一.理论概述 服务发现的概念简述 consul简述 二.部署docker+consul+Nginx案例 环境 部署 三.测试 四.总结 一.理论概述 服务发现的概念简述 在以前使用的是,N台机器 ...
随机推荐
- JAVA eclipse Maven项目红叹号解决方案
我是通过 Windows --> show view --> problems 查看到发现 ch.qos.logback 1.1.1 出现了错误, 于是我换成了 ch.qos.logbac ...
- Unity3D Shader 学习笔记(一):初识Shader
第一节:图形处理器简史 GPU发展简史 GPU英文全称Graphic Procssing Unit. T&L变换和光照流水线 可编程GPU GPU的优点和缺点 第二节:Unity Shader ...
- 冲刺Two之站立会议6
今天继续了昨天的工作,对视频进行优化.因为昨天的工作没有达到预期的效果,所以又继续对音质和画面质量做了相应的优化.还对相应的聊天室界面进行了优化.
- 《实时控制软件设计》之Github提交作业步骤
在掌握GIT/GITHUB基本操作后,接下来把第一次的编程作业提交到 https://github.com/RTCSD15/HOMEWORK1 ,把第二次的编程作业提交到https://github. ...
- c++实现计算器功能 -----初代
由于时间问题,我就写的简单一点. 课程作业一 git链接: Operations 里面的Operations.cpp文件就是完成品. 1 我就简单的对我原来的代码进行了重构,原本的代码已经把函数都分得 ...
- VS社区版 使用 OpenCover 获取测试代码覆盖率
注:暂不支持VS2017 Visual Studio 2015 社区版没有集成代码覆盖率的功能,所以想在VS社区版中获取单元测试的代码覆盖率等数据,需要使用到插件 OpenCover. 下载 Open ...
- 基于python的机器学习实现日元币对人民币汇率预测
## 导入所需的包 import pandas as pd import numpy as np import matplotlib.pyplot as plt import tensorflow a ...
- spring整合redis(jedis)
真是一步一个坑阿,学点新技术,这么难,这个异常: java.lang.IllegalStateException: Could not load TestContextBootstrapper [nu ...
- 设置macbook休眠模式
前言: macbook默认合上盖默认是进入混合休眠模式模式(mode 3),此时电脑还会供电.不想耗电的话关机的话当前的工作状态就丢失了. macbook实际上是可以进入休眠模式的,只是没开放出来,我 ...
- Android 自己写一个打开图片的Activity
根据记忆中eoe的Intent相关视频,模仿,写一个打开图片的Activity 1.在主Activity的button时间中,通过设置action.category.data打开一个图片.这时代码已经 ...