您的位置:首页 > Web前端 > CSS

今日收获 18/4/1

2018-04-01 23:48 211 查看
1.发现图片的<img>这个标签自动并排显示

2.今天发现,将div中的块级元素绝对定位后,与同级块状元素重叠了。所以,又看了书上定位各属性的意义。书上对
绝对定位的说法是:绝对定位的元素完全脱离HTML代码确定的页面流(把元素从页面流中移出,把元素置于页面之上)。也就是说,页面中的其它元素甚至不知道绝对定位元素的存在。如果不小心,其它元素甚至会完全隐藏到绝对定位的元素后面。(注意:不要试图在一个样式中同时使用float属性和静态static定位或相对定位之外的定位类型。float属性与绝对定位和固定定位不能同时应用到一个元素上)。类似于便利贴
相对定位:其位置相对于该元素在HTML流中的当前位置而定。页面中的其它元素会顾及相对定位元素在HTML流中原来的位置。因此,使用相对定位移动元素后,原先的位置会留空相对定位的主要用途不是移动元素,而是为其中需要绝对定位的元素设置参考点。因为通常只使用相对定位创建新的定位上下文,所以甚至无需设置上下左右的距离
静态定位:是web伊始浏览器定位内容的方式,就是从上到下显示HTML。可能永远不需要这么做。
可以同时指定左右位置以及上下,让浏览器确定元素的宽度和高度。
书中也说到:如果标签在使用绝对定位,相对定位或固定定位的另一个标签中,其位置相对于那个元素的边界而定。这就解决我的一个疑惑:如何在一个使用绝对定位的元素中用绝对定位定位元素。
而这篇文章也讲了什么是HTML中的页面流: 搞定HTML\CSS之absolute和relative

3.background: #748A9B url(bg2.gif) 0 0 repeat-y;

4.我想还是布局打好再做内容吧。

5.刚刚遇到的问题是:中间两栏布局(都设置了float),还有一个footer,给左栏设置宽度,右栏没有设置宽度后,footer跑到了左栏的右边,而右栏跑到了下方。而且即使给右栏设置了宽度,但如果中间间隙足够,footer仍然会挤到中间去。此时给footer清掉浮动就行了。另一个类似问题出现在两栏中,右栏比左栏内容更多,如果两个都设置浮动,那么右栏可能会浮动到左栏下方。这时候只能调高父元素的高度了吗?但其实我也没有设置它的高度(调高也没用,毕竟浮动是它的特点)。我又惊了!父元素这时候为什么有高度???。这种情况下是不是用绝对定位更好呢?
重述这里遇到的问题:
->当div中有两个同级的浮动div时,div没有高度,但是如果其中一个是div以外的块级元素如p元素就能被撑起来...
(p标签不可以自由嵌套的,p标签内只能嵌套内联元素,类似h1、div、ul块元素都不可自由嵌套在p标签内。)
但是在两栏均为浮动时,如果侧栏想要通过margin竖直方向置中是不行的。
6.我刚刚把notepad换成了Adobe的brackets(免费开源). 界面更扁平以及性冷淡,而且有自动缩进,有文件夹管理,HTML和CSS可以并排编辑,也是轻量级,暂时觉得很满意。我又发现它的“效果实时查看”功能很厉害啊,点击页面上的某个元素就能定位到你写的相应的代码上。而且如果在当前元素中添加不适用的属性时,它会自动标红。啊啊啊满意!
7.一个div中两个h标签,h标签会展开到外层元素的宽度。
8.发现几张图片并排置放时,即使margin,padding已全清0,图与图之间仍有几像素的间隙。但是如若使用float,间隙会消失。不太明白
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  CSS