边框圆角值的问题、white-space、word-wrap、margin对布局的影响
1、边框圆角(border-radius)值的问题
border-radius : 7px 7px 7px 0;
四个值的顺序是左上、右上、右下、左下
2、white-space 规定段落中的文本不换行,往往值是弄wrap
3、word-wrap 属性允许长的内容可以自动换行,属性值是break-word 允许 默认不允许
4、margin对布局的影响
margin是外边距 属性值是数字,数字也分正负
正数:margin:20px;
负数:在static(元素)中(标准流下)
margin-left 为负数当前元素向左走
margin-top为负数当前元素向上走
margin-bottom为负数当前元素不动,后面的元素向上走
margin-right为负数当前元素不动,后面的元素向左走
*注:margin为负数会增大当前元素的宽,(前提是当前元素没有设置width)
在float下,margin为负,也就是我们常用的双飞翼 圣杯布局
在absolute下,margin为负,让元素居中,前提是知道元素的高度
margin为负数,无论什么条件都是释放自己的空间,如果自己的margin不够就把自己的宽度贡献出去
边框圆角值的问题、white-space、word-wrap、margin对布局的影响的更多相关文章
- CSS3: border-radius边框圆角详解
border-radius 基本语法: border-radius : none | <length>{1,4} [/ <length>{1,4} ]? 取值范围: <l ...
- CSS3 border-radius边框圆角
在CSS3中提供了对边框进行圆角设定的支持,可对边框1~4个角进行圆角样式设置. 目录 1. 介绍 2. value值的格式和类型 3. border-radius 1~4个参数说明 4. 在线示例 ...
- css3(border-radius)边框圆角详解
传统的圆角生成方案,必须使用多张图片作为背景图案.CSS3的出现,使得我们再也不必浪费时间去制作这些图片了,只需要border-radius属性,支持浏览器IE 9.Opera 10.5.Safari ...
- 使用css3来实现边框圆角效果
经常看到别人的网站有个边框来修饰文字区域,类似圆角矩形把文字环绕起来,特别有感觉,于是就试着用图片边框来修饰,但是用图片过多会拉慢网页的加载速度,能不能使用css3来实现边框圆角效果呢?当然borde ...
- CSS的display、hover、overflow、©(版权符号)、borer-radius(边框圆角)
一.display: none 隐藏 block显示 visibility:hidden隐藏 visible显示 display:none和visibility:hidden这两个属性对应的值 ...
- CSS3 02. 边框、边框圆角、边框阴影、边框图片、渐变、线性渐变、径向渐变、背景、过渡transition、2D转换
边框圆角 border-radius 每个角可以设置两个值,x值.y值 border-top-left-radius:水平半径 垂直半径 border-radius:水平半径/垂直半径 border- ...
- 从零开始学 Web 之 CSS3(二)颜色模式,文字阴影,盒模型,边框圆角,边框阴影
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- CSS border-radius边框圆角
在CSS3中提供了对边框进行圆角设定的支持,可对边框1~4个角进行圆角样式设置. 目录 1. 介绍 2. value值的格式和类型 3. border-radius 1~4个参数说明 4. 在线示例 ...
- CSS3 边框 圆角 背景
CSS3用于控制网页的样式布局. CSS3是最新的CSS标准. 关于transform: transform:rotate(10deg);//顺时针方向旋转10° 浏览器支持情况:低版本的IE浏览 ...
随机推荐
- p1694猴子 并查集
有n只猴子,第一只尾巴挂在树上,剩下的n-1只,要么被其他的猴子抓住,要么抓住了其他的猴子,要么两者均有. 当然一只猴子最多抓两只另外的猴子,因为只有两只猴爪子嘛.现在给出这n只猴子抓与被抓的信息,并 ...
- hihocoder 1082 然而沼跃鱼早就看穿了一切 (替换指定的串 )
#1082 : 然而沼跃鱼早就看穿了一切 时间限制:1000ms 单点时限:1000ms 内存限制:256MB 描述 fjxmlhx每天都在被沼跃鱼刷屏,因此他急切的找到了你希望你写一个程序屏蔽所有句 ...
- CentOS7 安装和配置Tomcat
1.官网下载Tomcat的压缩包 https://tomcat.apache.org/download-70.cgi 2.使用Xftp5把下载的压缩包上传到 /usr/soft (soft文件夹自己新 ...
- cassandra复制到一个新机器编译失败的问题
在A机器上ant编译后,复制到B机器,在B机器上编译会出错. 原因是载入一些文件时出错,因为路径还是A机器上的路径. 经过与git上的源代码对比,发现多了一个build文件夹,这可能是ant生成的目录 ...
- 书写优雅的shell脚本(三) - shell中exec解析
参考:<linux命令.编辑器与shell编程> <unix环境高级编程> exec和source都属于bash内部命令(builtins commands),在bash下输入 ...
- I.MX6 AW-NB177NF WIFI 驱动移植问题
/******************************************************************************** * I.MX6 AW-NB177NF ...
- 【USACO2017JAN】 Promotion Counting
[题目链接] 点击打开链接 [算法] 离散化 + dfs + 树状数组 [代码] #include<bits/stdc++.h> using namespace std; #define ...
- bzoj3191卡牌游戏——概率DP
题目:https://www.lydsy.com/JudgeOnline/problem.php?id=3191 不用在意每个人的编号,只需看他们相对于庄家的位置即可: 所以设计状态f[i][j]为还 ...
- 【旧文章搬运】PE感染逆向之修复(Serverx.exe专杀工具出炉手记)
原文发表于百度空间,2008-10-4看雪论坛发表地址:https://bbs.pediy.com/thread-73948.htm================================== ...
- ccflow汇总帖
视频教程学习 公司电脑路径; E:\开源工作流\ccflow佳怡物流版\ccflow\doc cclfow的码云地址: https://gitee.com/opencc/ccflow 在线demo演示 ...