总结随笔

作者: MasteRiver | 来源:发表于2019-11-17 15:50 被阅读0次



网页布局

- 单列布局

- 双列布局

- 三列布局

- 混合布局

单列布局

其中单列布局最为简单,一般应用于搜索引擎主页。 单列布局在于设置块状元素居中,只需设置margin:0 auto;(前面的0是上下外面局,可任意设置)。

双列布局

两列布局在于设置中间主体并排分布,在左边的块设置float:left,在右边的块设置float:right即可,当然要使两者的width之和等于某一设定值。

三列布局

在两列布局的基础上再将中间块进行二次分割,方法一致

混合布局

由于中间主体设置了float,最后的footer需要通过清除浮动来正确显示在主体下方,clear:both。


元素定位

Value (position属性)Description

static默认值。没有定位,元素出现在正常的流中。

absolute生成绝对定位的元素,相对于static定位以外的第一个父元素进行定位。

relative生成相对定位的元素,相对于其正常位置进行定位。

fixed生成绝对定位的元素,相对于浏览器窗口进行定位。

inherit规定应该从父元素继承 position 属性的值。

sticky基于用户的滚动位置来定位。

relative

相对于自身的定位,可以通过调节top,bottom,left right给定一定的数值完成不同方向的移动定位。再给元素添加定位之后,该元素层级会提高。

absolute

给一个元素设定absolute属性后,该元素会相对于祖元素中第一个定位元素定位(不包括static)

fixed

fixed是一种特殊的absolute,fixed总是以body为定位对象的,按照浏览器的窗口进行定位。一般网页中的小广告都是通过fixed定位实现的。

sticky

粘性定位的元素是依赖于用户的滚动,在 position:relative 与 position:fixed 定位之间切换。 它的行为就像 position:relative; 而当页面滚动超出目标区域时,它的表现就像 position:fixed;,它会固定在目标位置。 元素定位表现为在跨越特定阈值前为相对定位,之后为固定定位。 这个特定阈值指的是 top, right, bottom 或 left 之一,换言之,指定 top, right, bottom 或 left 四个阈值其中之一,才可使粘性定位生效。否则其行为与相对定位相同。一般网页的导航栏会使用这样的定位。


选择器

id选择器(#加id名)

class选择器(.加class名)

style选择器(内敛属性,直接在相对应的元素添加style设置属性)

标签选择器(使用标签名选择)

后代选择器(通过一级一级向下选择,通过空格键或者>号连接)

群组选择器(具有相同属性的不同类或者不同元素是,可以在选择器之间以英文格式的逗号隔开选择)

优先级

内敛 > ID > class > 标签选择器

相关文章

  • 201907博客被封以后就写在这了

    月目标,年总结,阶段总结,与一些短期心情阅读随笔。

  • 4.22-4.28周总结&4.29-5.5周目标

    4.22-4.28周总结 1、日更完成7篇,其中随笔3篇,总结2篇,音标1篇,读后感1篇。整体来说,随笔所花时间少...

  • 目标函数的总结与整理

    博客园首页新随笔联系订阅管理 随笔 - 7 文章 - 0 评论 - 0 深度学习笔记 目标函数的总结与整理 (...

  • Angularjs 事件监听

    键盘事件keydown、keypress、keyup随笔整理总结(摘抄)原文1:http://www.cnblog...

  • 悦读乐写

    赵老师新教育知行合一061: ——教育随笔写满60篇总结: 到昨天为止,随笔写满了60篇,以每篇2000字计算,共...

  • WKWebview 使用总结(个人随笔-实战)

    WKWebview 使用总结(个人随笔) 本文只描述WKWebview的使用细节。记录在替换WKWebview...

  • 更新说明

    新的想法 看法 或 点子,第一时间发随笔,随笔不代表最终观点. 最终观点将在相应文集出现.以便于梳理,总结,查阅....

  • 『思』那些天的618购物

    本期内容属于《那些天的醒悟》系列文章,又名光速复盘系列,属于随笔中的随笔。 做任何事情都是对自我厌恶的总结 艾玛,...

  • 日供一卒——读书、学习、打卡、锻炼 2020-10-06

    本文目前分为四个部分:读书总结、学习打卡、理财学习、身体锻炼。 随笔 今天做了一个总结,发现之前自己的学习方式存在...

  • 随笔总结

    2018.23-25这三天开始到学校报道,开始不一样的生活 23号上午8:30到学校报道,一直等到11:00才召唤...

网友评论

    本文标题:总结随笔

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