p{
font-size: 15px; text-indent: 2em;
}
.alexrootdiv>div{
background: #eeeeee; border: 1px solid #aaa;
width: 99%; padding: 5px; margin: 1em 0 1em 0;
}
.alexrootdiv>div>p:first-of-type,.alextitlep{
font-size: 18px; font-weight: bold; color: red;
}
.alexrootdiv span{
color:blue;font-weight:bold;
}
.alexrootdiv table{
margin-top:10px;border-collapse:collapse;
border:1px solid #aaa;width:100%;
}
.alexrootdiv table th{
vertical-align:baseline;padding:5px 15px 5px 6px;
background-color:#d5d5d5;border:1px solid #aaa;text-align:left;
}
.alexrootdiv table td{
vertical-align:text-top;padding:6px 15px 6px 6px;
background-color:#efefef;border:1px solid #aaa;
}
.attentationp{
font-size: 15px; text-indent: 2em;
background: #ee0; color: red; font-weight: bold;
}
-->

1
2
3
4
 <style><!--
.col-3{
width: calc(100%/3 - 6px);
float: left;
margin-right: calc(6px*3 /2);
background: #fff;
color: #333;
height: 100px;
text-align: center;
margin-bottom: calc(6px*3 /2);
font-size: 18px;
line-height: 100px;
box-shadow:0 0 10px;
}
.col-3:nth-child(3){
margin-right: 0;
}
.container{
overflow:hidden;
}
.alexrootdiv{
font-family: 微软雅黑;
margin: 0;
padding: 0;
}
.alexrootdiv>p{
font-size: 15px; text-indent: 2em;
}
.alexrootdiv>div{
background: #eeeeee; border: 1px solid #aaa;
width: 99%; padding: 5px; margin: 1em 0 1em 0;
}
.alexrootdiv>div>p:first-of-type,.alextitlep{
font-size: 18px; font-weight: bold; color: red;
}
.alexrootdiv span{
color:blue;font-weight:bold;
}
.alexrootdiv table{
margin-top:10px;border-collapse:collapse;
border:1px solid #aaa;width:100%;
}
.alexrootdiv table th{
vertical-align:baseline;padding:5px 15px 5px 6px;
background-color:#d5d5d5;border:1px solid #aaa;text-align:left;
}
.alexrootdiv table td{
vertical-align:text-top;padding:6px 15px 6px 6px;
background-color:#efefef;border:1px solid #aaa;
}
.attentationp{
font-size: 15px; text-indent: 2em;
background: #ee0; color: red; font-weight: bold;
}
--></style>
<div class="alexrootdiv">
<div class="container">
<div class="col-3">1</div>
<div class="col-3">2</div>
<div class="col-3">3</div>
<div class="col-3">4</div>
</div>
</div>

CSS3学习笔记(4)-CSS3函数的更多相关文章

  1. CSS3学习笔记(3)-CSS3边框

    p{ font-size: 15px; } .alexrootdiv>div{ background: #eeeeee; border: 1px solid #aaa; width: 99%; ...

  2. CSS3学习笔记(1)-CSS3选择器

    p{ font-size: 15px; text-indent: 2em; } .alexrootdiv>div{ background: #eeeeee; border: 1px solid ...

  3. IOS学习笔记07---C语言函数-printf函数

    IOS学习笔记07---C语言函数-printf函数 0 7.C语言5-printf函数 ------------------------- ----------------------------- ...

  4. IOS学习笔记06---C语言函数

    IOS学习笔记06---C语言函数 --------------------------------------------  qq交流群:创梦技术交流群:251572072              ...

  5. Typescript 学习笔记三:函数

    中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...

  6. ES6学习笔记<三> 生成器函数与yield

    为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ...

  7. OpenCV 学习笔记03 findContours函数

    opencv-python   4.0.1 1 函数释义 词义:发现轮廓! 从二进制图像中查找轮廓(Finds contours in a binary image):轮廓是形状分析和物体检测和识别的 ...

  8. canvas学习笔记、小函数整理

    http://bbs.csdn.net/topics/391493648 canvas实例分享 2016-3-16 http://bbs.csdn.net/topics/390582151 html5 ...

  9. Go语言学习笔记七: 函数

    Go语言学习笔记七: 函数 Go语言有函数还有方法,神奇不.这有点像python了. 函数定义 func function_name( [parameter list] ) [return_types ...

随机推荐

  1. ASP.NET MVC5+EF6+EasyUI 后台管理系统(82)-Easyui Datagrid批量操作(编辑,删除,添加)

    前言 有时候我们的后台系统表单比较复杂,做过进销存或者一些销售订单的都应该有过感觉 虽然Easyui Datagrid提供了行内编辑,但是不够灵活,但是我们稍微修改一下来达到批量编辑,批量删除,批量添 ...

  2. Loadrunner 在controller中运行socket脚本时报错:Abnormal termination, caused by mdrv process termination 的原因和解决方法

    原因: 网上给出的可能的原因大致有两个: 1.  压力负载机器的资源不足(CPU,内存) 2.  分配内存和释放内存的语句不匹配. 并给出了一些解决方案,最开始我以为是加了IP地址的原因,不断尝试增加 ...

  3. CHM文件无法打开的解决方法

    转载请注明来自:http://www.yaosansi.com原文地址:http://www.yaosansi.com/post/cannot_open_chm_file.html 目录:一.正确操作 ...

  4. javaweb 打包为安卓apk(1)-Hbuilder

    需求:当前已经完成java web项目开发,java web项目前端使用自适应框架(bootstrap),想使用最简单方式生成一个安卓apk,无需进行安卓开发(类似于手机浏览器访问一样) 要求:项目已 ...

  5. BI数据分析中KPI,KGI,CSF概念

    1. 行为产生数据 先来谈一谈,自己对数据基础概念的思考.我认为首先要建立的核心观点是:行为产生数据. 翻译一下这个核心观点.意思就是,当我们在思考或描述数据相关需求的时候,必然要包含这样的语素:&q ...

  6. vue2.0全局组件之pdf

    目的:像elementUI那样注册全局组件 预览pdf文件 技术支持:使用火狐的pdf.js http://mozilla.github.io/pdf.js/ 准备:新建一个CPdf.vue文件,把火 ...

  7. DES加密解密与AES加密解密

    随着开发时间的变长,当初认为比较难的东西,现在渐渐也就变的不那么难了!特别对于一些经常很少使用的类,时间长了之后渐渐就陌生了.所以在这里写一些日后可能会用到的加密与解密. 一.AES加密算法和DES加 ...

  8. 使用java.util.Properties类读写配置文件

    J2SE 1.5 以前的版本要求直接使用 XML 解析器来装载配置文件并存储设置,虽说也并非难事,相比 java.util.Properties却要做额外的解析工作.而java.util.Proper ...

  9. BOM基础(一)

    学完了js的基础语法和DOM之后,就要要看看javascript中最后一项BOM了.BOM,全称brower document model,翻译过来就是浏览器对象模型.DOM是文档对象模型,属于BOM ...

  10. 读书笔记 effective c++ Item 31 把文件之间的编译依赖降到最低

    1. 牵一发而动全身 现在开始进入你的C++程序,你对你的类实现做了一个很小的改动.注意,不是接口,只是实现:一个私有的stuff.然后你需要rebuild你的程序,计算着这个build应该几秒钟就足 ...