1 background(复合属性)与font(复合属性) 2 行内块的间距问题 3 行内元素的margin 4 清除浮动 5定位的元素的层级 6 Border-radius: 边框半径
1 background(复合属性)与font(复合属性):

background: 颜色 图片的链接 是否平铺 背景位置 是否滚动。(可以随意调动或省略)

Font: 粗度 字体风格 字体大小/行高 字体样式
字体大小和样式不可省略
2 行内块的间距问题
行内块元素相邻时,行内块元素之间会有几像素的间距,只有通过浮动解决。
3 行内元素的margin
行内元素的上下外边距不起作用,左右起作用。
4 清除浮动
| 给父盒子设置一个高度 | ||
| Clear: both | ||
| Overflow: hidden | 触发了BFC模式 也可以用来清除浮动 | |
|
伪元素或是双伪元素清除法 |
.clearfix:before, .clearfix:after {
|
5定位的元素的层级
如果只给一个元素设置absolute 不设置trbl会显示在原位子
如果只给一个元素绝对定位,而不写trbl值的话,会以原位显示
定位(相对和绝对或固定)的元素都有一个层级的属性或是概念。如果定位了的相邻多个元素,在同一个位置的话,后面的元素默认会压住前面的元素。如果同样是定位了的元素,默认他们的层级都是0,只不过后面的元素会压住前面的元素。如果想让当前的元素显示在后面的元素之上,这个时候就需要改变层级的关系,用z-index来改变。
z-index的取值范围0---9999999,最好是正数,尽量不要用负数。
6 Border-radius: 边框半径
Border-radius:左上,右上,右下,左下
当四个值达到宽度或高度较小的一般的 会达到峰值
这是个css3属性 有兼容问题 但不会影响想要表达的内容
1 background(复合属性)与font(复合属性) 2 行内块的间距问题 3 行内元素的margin 4 清除浮动 5定位的元素的层级 6 Border-radius: 边框半径的更多相关文章
- Web前端篇:CSS常用格式化排版、盒模型、浮动、定位、背景边框属性
目录 Web前端篇:CSS常用格式化排版.盒模型.浮动.定位.背景边框属性 1.常用格式化排版 2.CSS盒模型 3.浮动 4.定位 5.背景属性和边框属性 6.网页中规范和错误问题 7.显示方式 W ...
- 前端1-----CSS颜色属性,字体文本和背景属性,边框属性,margin和padding,盒模型,行内块转换,浮动,三大定位
前端1-----CSS颜色属性,字体文本和背景属性,边框属性,margin和padding,盒模型,行内块转换,浮动,三大定位 一丶css选择器的优先级 行内 > id选择器 > 类选择器 ...
- CSS中浮动属性float及清除浮动
1.float属性 CSS 的 Float(浮动),会使元素向左或向右移动,由于浮动的元素会脱离文档流,所以它后面的元素会重新排列. 浮动元素之后的那些元素将会围绕它,而浮动元素之前的元素将不会受到影 ...
- CSS font 复合属性的顺序
CSS 参考手册 实例 在一个声明中设置所有字体属性: p.ex1 { font:italic arial,sans-serif; } p.ex2 { font:italic bold 12px/20 ...
- 使用resultMap实现ibatis复合数据结构查询(1.多重属性查询;2.属性中含有列表查询)
以订单为例(订单详情包括了订单的基本信息,配送物流信息,商品信息),直接上代码: 1.多重属性查询 java实体 public class OrderDetail { @XmlElement(requ ...
- font——文字属性大全
一.字体风格(font-style) <style type="text/css"> /*默认值.浏览器显示一个标准的字体样式.*/ p.normal {font-st ...
- 【转载】CSS font关键字属性值的简单研究
文章转载自 张鑫旭-鑫空间-鑫生活 http://www.zhangxinxu.com/wordpress/ 原文链接:http://www.zhangxinxu.com/wordpress/?p=5 ...
- CSS基础 和 font字体、背景属性连写 与 清除浮动方法
1.伪类 1. :link 2. :visited 3. :hover(重要) 4. :active 5. :focus(input标签获取光标焦点) 2.伪元素 1.:first-letter 2. ...
- css字体样式(Font Style),属性
css字体样式(Font Style),属性 css字体样式(Font Style)是网页中不可或缺的样式属性之一,有了字体样式,我们的网页才能变得更加美观,因此字体样式属性也就成为了每一位设计者 ...
随机推荐
- html内的空格占位
写html的时候有时因为字数不够会根据字段长度添加多个空格,但是在html中添加空格是没有用的,所以使用空格的代替符号有: 不断行的空白(1个字符宽度) 半个空白(1个字符宽度) 一个空白 ...
- vue2.0环境搭建
1.安装node.js(官网) 2.安装淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 3.安装webpack ...
- GTest Google的一种白盒单元测试框架 开源项目
GTest为google开源的白盒单元测试跨平台测试框架,含丰富的断言.类型参数化测试.死亡测试.以及其他的测试选项设置.文件保存等,以下将对该项目C++的实现进行简要的分析,作为学习记录备份. 基本 ...
- Power服务器中KVM克隆新虚拟机
查看当前所有虚拟机:virsh list --all 克隆新虚拟机:virt-clone -o guest01 -n guest02 -f /var/lib/libvirt/images/guest ...
- UWP 判断windows mobile是使用的实体键还是虚拟按键
最近在写启动屏幕,发现虚拟按钮会挡住,启动屏幕的最下面的元素,大概有50 px.可是有什么办法知道手机是用的实体键还是虚拟按键吗? 如下图.可以看到红色的部分显示了一点点.代码里设置的是60px. 在 ...
- 学习微信小程序之css9内边距
padding内边距 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...
- asp.net中获取本机的相关信息!(CPU、内存、硬盘序列号等)
// 注意:首先要在项目bin目录中添加引用 System.Management using System;using System.Collections.Generic;using System. ...
- 下载aptana插件jar包
通过eclispe插件市场找到插件地址如下,浏览器打开下载对应包 http://studio-jenkins.appcelerator.org/job/studio3-feature-developm ...
- 转:Delphi的类与继承(VB与delphi比较)
既然已经做出了com程序用delphi来开发的决定,那当然就要对delphi进行一些深入的了解.有人说delphi是一个用控件堆砌起来的工具,和vb没什么两样:也有人说dephi实际上是面向过程的,他 ...
- css3实现圆形逐渐减少动画
写这个动画刚开始完全没有思路,后来参考网上的资料发现可以用半圆实现,具体原理如下: 1.,一个div作为背景,三个div做出三个半圆出来,一个用于旋转,一个靠左(用于与背景吻合),一个靠右(用于与背景 ...