美文网首页
前端基本功--css实战1 9.10

前端基本功--css实战1 9.10

作者: 多佳小昕 | 来源:发表于2017-09-16 21:10 被阅读0次

一、京东页面

1.Font字体综合写法

font:字体加粗  字号/行高 字体;

font-weight:bold = 700;正常是400

2.用于做一些小装饰的标签:

s  del删除线

i   em倾斜

u   ins下划线

3.字体的装饰:

字体加粗font-weight: 700;

让字体不加粗:  font-weight:normal;

字体倾斜:  font-style:italic;不用

字体不倾斜:font-style:normal;

不下划线不删除线:  text-decoration: none;

4.定位

(1)position:static 静态定位 约等于标准流

(2)浮动的不浮动 float:none;  none left right

        定位的不定位  position:static ;  absolute relative fixed

5.权重问题

标签 1   类10     id 100    行内1000

6.网页的稳定性

Width和height最稳定  其次padding  最后才考虑margin

7.关于浮动

浮动目的:可以让多个块级元素放到一行上。

清除浮动的目的:就是为了解决父盒子高度为0的问题。

清除浮动:

1.额外标签法

2. Overflow: hidden触发bfc模式 就不用清楚浮动

3.伪元素

.clearfix:after {

content:””;

Visibility:hidden;

Display:block;

Height:0;

Clear:both;

}

.clearfix{

Zoom:1;

}

清除浮动:真正的叫法闭合浮动(将clearfix加在父级元素上)

.clearfix:before,.clearfix:after{

display:table;

content:"";

}

.clearfix:after{

clear:both;

}

.clearfix{

zoom:1;

}

overflow:hidden;属性可以保证div的高度或宽度不变。

div里添加的东西再多,高度或宽度也不变。超出的部分隐藏。使盒子保持本身的宽高。

相关文章

  • 前端基本功--css实战1 9.10

    一、京东页面 1.Font字体综合写法 font:字体加粗 字号/行高 字体; font-weight:bold ...

  • 前端攻城狮的标准

    前端工程师该达到的要求 1 基本功 HTML、CSS、JavaScript基本功,数学、算法、数据结构、操作系统、...

  • 前端基本功--css实战3 9.19

    一、z-index 只有定位(除了static)的盒子才有,才有z-index。 当都有定位的时候,层级默认是0,...

  • 前端基本功--css实战2 9.14

    一、鼠标 Cursor: pointer鼠标变成小手 Cursor: default;小白 Cursor : mo...

  • WEB(2)

    1.1前端职能: 将网页的视觉、交互效果、基本功能通过Web前端技术<狭义的为html、css、javascrip...

  • 前端知识体系

    浏览器相关 浏览器组成部分 浏览器内核 浏览器存储 前端与协议 HTML5 CSS 实战1 git学习 Css3 ...

  • animation参考

    web前端入门到实战:10分钟入门 CSS3 Animation - 前端天宇的文章 - 知乎https://zh...

  • 前端秘籍,看程序员如何用九个招式,搞定css水平居中

    CSS水平居中 text-align:center是前端工程师的基本功,我在项目中经常遇到CSS水平居中的需求,这...

  • 前端面试总结

    前端开发面试知识点大纲: HTML&CSS: 对Web标准的理解、浏览器内核差异、兼容性、hack、CSS基本功:...

  • 前端面试宝典(全文较长)

    前端开发面试知识点大纲: HTML&CSS: 对Web标准的理解、浏览器内核差异、兼容性、hack、CSS基本功:...

网友评论

      本文标题:前端基本功--css实战1 9.10

      本文链接:https://www.haomeiwen.com/subject/xysjqxtx.html