CSS知识点
1)如何实现横向布局呢?
在子标签加上float:left属性,再给父标签类名加上clearfix。
clearfix是什么呢?在css里面的三句代码,如下:
clearfix名字随意写。
2)<span>1</span>
<span>2</span>
上面俩<span>标签在页面上显示是 “1空格2” 1和2中间有个空格。浏览器会把HTML代码中的所有空格和回车,当成一个空格并在页面上显示出来。
3)想在鼠标hover之后下面有条线,类似下图:
hover后,hover前只需要border-bottom属性即可,不过内容之间会有细微的位置移动,解决这个问题需要给每个标签先加上border-bottom,设置成透明,这样就不会有移动问题了。
4)使用width和height属性会带来N多的问题,能不用就不用。
5)max-width比width要好一些。
6)可以通过设置元素的padding和margin来控制元素之间的距离。
7)div的高度由什么来决定呢?
div的高度由其内部文档流元素的高度总和来决定。
8)什么是文档流呢?
文档流是文档内元素流动的方向。
内联元素从左往右流动,每个元素不会另起一行,宽度不够会在新的一行继续从左往右流动。
块级元素从上往下流动,每个元素会另起一行。
内联元素中如果有英文存在,默认即使宽度不够,该英文也不会换行,解决这个问题需要word-break属性。
9)内联元素的div高度由什么来决定呢?
由元素内字体和字体的建议高度决定。
10)div居中的技巧
margin-left:auto;margin-right:auto;
11)几个学习CSS的资源
google搜索:关键词 mdn
google搜索:阮一峰 css
google搜索:张鑫旭
https://css-tricks.com/(CSS的技巧,包括画各种图形)google搜索:关键词 css tricks
https://tympanus.net/codrops/category/playground/(各种酷炫的效果)
http://www.ayqy.net/doc/css2-1/cover.html(css文档)
http://iconfont.cn/(可以引入各种图标)