CSS相关

所有子元素浮动,父类加上class='clearfix'

开发者工具 computed 网页计算出样式的像素大小

div高度由其内部文档流元素的高度总和所决定(决定≠相等)

文档流:文档内元素的流动方向。

内联元素从左往右,如果受到阻碍,换行继续流

块级元素,每一个块级元素各占一行,从上往下流。

break属性:  word-break:break all  (全部被打断,建议页面是中文时使用)

字体不同,字体的建议行高不同

脱离文档流:posttion:fixed;(相对于屏幕左上角)

span:不接受设置宽高;

内联元素 不接受宽高

尽量不要设置宽高 用padding

css三角形 运用边框

border:width:0px, height:0px.

border-top-width:三角形中心到顶部的距离

三角形:设置4个透明的边框 把上面的三角形干掉(三角形中心到顶部距离为0) 左边的三角形给一个颜色 就会有一个直角三角形

span里面不能放div 放了会bug,所以放span。

span{display:block}==div

脱离文档流:子元素CSS:position:absolute; 父元素CSS: position:relative;  且absolute相对于relative定位。

css-tricks.com 用css画各种图形

水平居中

1、块级元素

如果一个块级元素被人为设置了宽度,即它的宽度已经确定,那么就可以给它添加以下 CSS 使其在所在行居中显示。

margin-left:auto;

margin-right:auto;

这种方法只适合于确定了宽度的块级元素,虽然不建议为一个元素设置宽高,但是我们可以给它设置一个最大宽度,这样以上的居中方法也是有效的。

如果实在无法确定块级元素的宽度,可以用display: inline-block;进行转换,然后用内联元素的居中方法将其水平居中

2、内联元素

内联元素通常都出现在块级元素中,只需给父元素添加text-align: center;即可使其居中显示。如果它没有父元素,给它外面套一个就好了。

注:text-align: center;只对子代的内联元素有效,对块级元素是无效的。

对于单一的内联元素,因为其宽度就是文字的长度,可以给它添加左右相同大小的 padding,这样在它自己的盒子中看上去就是居中的了。

推荐阅读更多精彩内容

  • 一、CSS入门 1、css选择器 选择器的作用是“用于确定(选定)要进行样式设定的标签(元素)”。 有若干种形式的...
    宠辱不惊丶岁月静好阅读 992评论 0 6
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 24,310评论 1 45
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 12,339评论 1 91
  • CSS 是什么 css(Cascading Style Sheets),层叠样式表,选择器{属性:值;属性:值}h...
    崔敏嫣阅读 1,103评论 0 5
  • hadoop.security.auth_to_local参数用于将kerberos的principal映射为比较...
    hzrick阅读 2,897评论 0 2
  • 《知·食——意大利》目录上一篇:百思不得其解的饮食仪式 【知·食】的目的,是将准确的、真实的、纯粹的饮食内容推给真...
    裸食阅读 838评论 17 23
  • 这两天白天喝了一点咖啡,你也没有睡的更差,看了你对咖啡有耐受力,不过今天怎么那么不甘心睡觉呢,你想吃就吃想睡就睡,...
    Denisezhao阅读 117评论 1 1
  • 贫困不是贵州独有的产物,也不是贵州特殊的符号。——小引 距离市区约三小时的车程,到达一个名叫西凉乡的地方。据说是国...
    时光墨迹阅读 275评论 0 1