2021-09-12

cssfloat 浮动

CSS 的 Float(浮动),会使元素向左或向右移动,其周围的元素也会重新排列。

Float(浮动),往往是用于图像,但它在布局时一样非常有用。

清除浮动:clear

css布局-水平-垂直对齐

元素居中对齐:margin:auto

文本居中对齐:text-align:center

图像居中对齐:margin:auto


左右对齐:1.使用定位方式

                  2.使用float方式

垂直对齐:1.使用padding

                2.使用line-height

                3.使用position和transform

padding:文本仍然处于容器垂直居中的位置,但是容器的 height 会随着文本行数的增加而增大;

 2)line-height=height:容器的 height 不变,line-height 是文本的行间距,文本会溢出容器显示;

多行文本可使用 vertical-align: middle; 来实现元素的垂直居中,但是如果子元素的内容体积大于父元素的内容体积时,仍然会溢出,后面需要使用文字溢出处理来解决。

css组合符?不懂

CSS组合选择符包括各种简单选择符的组合方式。

在 CSS3 中包含了四种组合方式:

后代选择器(以空格     分隔)

子元素选择器(以大于 > 号分隔)

相邻兄弟选择器(以加号 + 分隔)

普通兄弟选择器(以波浪号 ~ 分隔)

css伪类以及伪类元素

css导航栏

导航栏=链接列表

垂直导航栏            块元素链接

水平导航栏              内联列表项(inline),浮动列表项(float)

激活/当前导航条列表      在点击了选项后,我们可以添加 "active" 类来标准哪个选项被选中 

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 什么是选择器 每一条css样式声明(定义)由两部分组成,形式如下: 在{}之前的部分就是“选择器”,“选择器”指明...
    小挠许阅读 2,790评论 0 1
  • 学会使用CSS选择器熟记CSS样式和外观属性熟练掌握CSS各种选择器熟练掌握CSS各种选择器熟练掌握CSS三种显示...
    七彩小鹿阅读 11,435评论 2 66
  • # css: > 1. 学会使用CSS选择器 > 2. 熟记CSS样式和外观属性 > 3. 熟练掌握CSS各种选择...
    欣简书阅读 1,066评论 0 0
  • 课程目标: 学会使用CSS选择器熟记CSS样式和外观属性熟练掌握CSS各种选择器熟练掌握CSS各种选择器熟练掌握C...
    前端陈陈陈阅读 1,943评论 0 1
  • 课程目标: 学会使用CSS选择器熟记CSS样式和外观属性熟练掌握CSS各种选择器熟练掌握CSS各种选择器熟练掌握C...
    桃花兰岛主阅读 3,604评论 0 1