Nginx的介绍以及编译安装详解
HTML&CSS基础-浏览器默认样式
作者:尹正杰
版权声明:原创作品,谢绝转载!否则将追究法律责任。
一.查看浏览器的默认样式
1>.编写测试HTML代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>默认样式</title>
<style type="text/css">
/**
* 浏览器的默认样式:
* 浏览器为了在页面中没有样式时,也可以有一个比较好的显示效果,所以为很多的元素都设置了一些默认的margin和padding;
* 而浏览器的这些默认样式,正常情况下我们时不需要使用的,所以我们往往在编写样式之前需要将浏览器中的默认的margin和padding统统去掉;
*
*/
.box1{
width: 100px;
height: 100px;
background-color: red;
} p{
background-color: yellow;
}
</style>
</head>
<body>
<div class="box1"></div>
<p>我是一个p标签</p>
<p>我是一个p标签</p>
<p>我是一个p标签</p>
<p>我是一个p标签</p>
</body>
</html>
2>.打开浏览器查看效果

3>.打开debug模式

4>.查看div标签,并没有看到任何边距配置,如下图所示

5>.查看body标签,发现body竟然有默认的外边距,如下图所示

6>. 继续审查元素查看p标签,发现浏览器也为它设置了默认的上边距和下边距

二.去掉默认样式的代码
1>.编写二去掉默认样式的HTML代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>默认样式</title>
<style type="text/css">
/**
* 浏览器的默认样式:
* 浏览器为了在页面中没有样式时,也可以有一个比较好的显示效果,所以为很多的元素都设置了一些默认的margin和padding;
* 而浏览器的这些默认样式,正常情况下我们时不需要使用的,所以我们往往在编写样式之前需要将浏览器中的默认的margin和padding统统去掉;
*
*/ /**
* 清除浏览器的默认样式,虽然说"*"这种同配选择器性能并不好,后面会为大家介绍更适合的方法
*/
*{
margin: 0;
padding: 0;
}
.box1{
width: 100px;
height: 100px;
background-color: red;
} p{
background-color: yellow;
}
</style>
</head>
<body>
<div class="box1"></div>
<p>我是一个p标签</p>
<p>我是一个p标签</p>
<p>我是一个p标签</p>
<p>我是一个p标签</p>
</body>
</html>
2>.浏览器查看效果如下图所示

3>.打开浏览器的debug模式验证效果如下图所示

Nginx的介绍以及编译安装详解的更多相关文章
- centOS linux 下nginx编译安装详解
Nginx的官方网站是 www.nginx.org Nginx的下载地址是:http://nginx.org/en/download.html 由 于官网的设计非常简洁不大气不上档次,所以我们 ...
- linux 编译安装详解
相信大家大多都听过linux 的编译安装,但它到底是怎么把源代码变为自己电脑里可以应用的软件哪?今天,小编就以httpd 为例详细讲解一下. 什么是编译安装--编译:将源代码变为机器可执行的代码文件. ...
- linux http服务源码编译安装详解
相信大家大多都听过linux 的编译安装,但它到底是怎么把源代码变为自己电脑里可以应用的软件哪?今天,小编就以httpd 为例详细讲解一下. 什么是编译安装——编译:将源代码变为机器可执行的代码文件. ...
- hadoop2.2.0 centos 编译安装详解
http://blog.csdn.net/w13770269691/article/details/16883663 废话不讲,直切正题. 搭建环境:Centos x 6.4 64bit 1.安装JD ...
- Linux—编译安装详解
编译安装python3 1.python是通过C语言编写,所以在编译安装python3时需要在C语言环境 [root@localhost ~]# yum install -y gcc 2.python ...
- apache源码编译安装详解
查看是否安装 rpm -qa httpd 如果已安装,则卸载:rpm -e 卸载 --nodeps 不考虑意外 下载 wget http://mirrors.sohu.c ...
- centOS linux 下PHP编译安装详解
一.下载PHP源码包 wget http://php.net/distributions/php-5.6.3.tar.gz 二.添加依赖应用 yum install -y gcc gcc-c++ ...
- Bitcoin源代码编译安装详解
一.安装准备 安装环境:虚拟机Ubuntu 16.04 内存:2G 错误1:如果这里内存分配为1G,则会产生如下错误: g++ : internal compiler error: Killed (p ...
- Mysql编译安装详解
wget http://mirrors.cnnic.cn/apache/httpd/mysql-5.5.20.tar.gz root@Mysql-server ~]# yum install -y c ...
随机推荐
- 第三个Sprint冲刺第3天
成员:罗凯旋.罗林杰.吴伟锋.黎文衷 组内各成员加紧完成自己的工作.
- RedHat 5.6 问题简记
1.XDMCP协议 使用XDMCP协议,需要配置“远程屏幕”(禁用+简介模式+与本地模式相同),注意不是"远程桌面"(这就是VNCServer). XDMCP协议与VNC协议的本质 ...
- python decimal.quantize()参数rounding的各参数解释与行为
我最开始其实是由于疑惑ROUND_FLOOR和 ROUND_DOWN的表现区别才看了一波文档,但是感觉拉出一票以前没有留意过的东西. 贴一个decimal文档里面的解释: ROUND_CEILING ...
- calico实现docker容器内部的网络链接
calico官网 https://www.projectcalico.org// calico介绍 http://www.sdnlab.com/17161.html calico网络 环境 系统 ...
- springMVC 使用WebApplicationContext获取ApplicationContext对象
主要用于从application中获取bean 1.applicationContext 在web.xml中使用listener配置 <context-param> <param-n ...
- 微信小程序开发UI组件
第一 view和input和button组件 1.UI组件的通用属性 (1)id 唯一标识 (2)class 设置组件的样式类 (3)style 设置组件的内联样式 (4)hidden ...
- Highcharts之3D柱状图
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 配置dataimport时候 如果css样式有问题 要修改index和admin的版本号
- codeforces439B
Devu, the Dumb Guy CodeForces - 439B Devu is a dumb guy, his learning curve is very slow. You are su ...
- 洛谷P2698 [USACO12MAR]花盆Flowerpot
P2698 [USACO12MAR]花盆Flowerpot 题目描述 Farmer John has been having trouble making his plants grow, and n ...