码农知识堂 - 1000bd
  •   Python
  •   PHP
  •   JS/TS
  •   JAVA
  •   C/C++
  •   C#
  •   GO
  •   Kotlin
  •   Swift
  • CSS期末复习速览(二)


    1.元素显示模式分为三种:块元素,行内元素,行内块元素

    2.块元素:常见的块元素:

    ~

       

       

       
         
           
      1. ,特点:自己独占一行;高度,宽度,内外边距可以控制;宽度默认是父宽度的100%;里面可以放行内或者块元素

        3.行内元素:常见的行内元素: ,特点:相邻行内元素在一行上,一行可以显示多个;高,宽直接设置是无效的;默认宽度就是它本身内容的宽度;行内元素只能容纳文本或其他行内元素

        4.行内块元素:常见的行内块元素:    ,同时具有块元素和行内元素的特点,特点:和相邻行内元素(行内块)在一行上,但是它们之间会有空白缝隙,一行可以显示多个(行内元素特点);默认宽度就是它本身内容的宽度(行内元素特点);高度,行高,内外边距都可以控制(块元素特点)

        5.元素显示模式转换:转为块元素:display:block;转为行内元素:display:inline;转为行内块元素:display:inline—block;常用途径:增加的触发范围,从行内元素转为块元素

        6.背景颜色:background—color:颜色值;默认是transparent(透明)

        7.背景图片:background—image:url(图片地址);常用于装饰小图片或超大背景图

        8.背景平铺:background—repeat:repeat | no—repeat | repeat—x | repeat—y,默认是repeat的

        9.背景位置:background—position:x  y;两种参数:第一种方位名词:top/center/bottom/left/center/right,第二种精确单位:px  px

        10.背景固定:background—attachment:scroll(滚动)/fixed(固定),设置背景图片是否随着页面滚动而滚动

        11.背景颜色半透明:rgba(red,green,blue,alpha),alpha的值在0—1之间,0是全透明,1是不透明

        12.CSS三大特性:层叠性,继承性,优先级

        13.层叠性:就近原则,但最近的只会覆盖有冲突的,而不是全部覆盖

        14.子元素可以继承父元素的样式(text—系列,font—,line—系列,以及color)

        15.优先级主要看权重的大小

        注意:复合选择器是累加;无论父元素的权重多大,其子元素继承的权重都是0

        16.盒子模型的四个组成:边框,外边距,内边距,实际内容

        17.边框:border—width:px,设置边框大小;border—style:solid(实线)/dashed(虚线)/dotted(点线),设置边框样式;border—color:颜色,设置边框颜色;可以复合写,同时可以指定单方向边框:border—top/bottom/left/right;

        18.border—collapse:collapse;控制边框合并不加粗;同时边框会影响盒子的实际大小,因此要记得给width/height减去对应的大小

        19.内边距:padding—top/bottom/left/right;控制内容和边框之间的距离;可以复合写,按照顺时针方向给值;

        20.同时内边距也会影响盒子的实际大小,因此要记得给width/height减去对应的大小;如果盒子本身没有指定width/height属性,则此时padding不会撑开盒子大小

  • 相关阅读:
    栈(Java)
    Ubuntu server 24 (Linux) 安装部署smartdns 搭建智能DNS服务器
    Redis的五大基础数据类型
    PaddleClas学习2——使用PPLCNet模型对车辆朝向进行识别(python)
    regexp 应用
    Nginx-动态代理
    文件对比工具Beyond Compare 4(4.4.7) for Mac
    荟味齐鲁鲁菜网站/美食网站/菜谱网站
    浅谈小程序开源业务架构建设之路
    leetcode-693.交替位二进制数
  • 原文地址:https://blog.csdn.net/2301_80369371/article/details/139719390
  • 最新文章
  • 【FHE】我们如何实现同态加密推理(八):SiLU 的密文化——两条路径,和一个 8 字节的开关
    SQLcl 中 c/old/new 替换变量为何失效?先定位再替换
    不让模型写作文,直接从它脑子里读答案:Jev 决策在 .NET 的两条路线
    Halo插件:支持GitHub的图床附件策略
    电视投屏界的“一股清流”!SimpleTVCast 6.0.0-beta 抢先体验:无需TV端App,界面大换血!✨
    华三VXLAN集中式网关实战指南:Spine多活网关 + 双活接入(M-LAG)
    软件更好写之后口碑会更重要
    大 O、大 Omega、大 Theta 的区别,O(n) 复杂度是什么意思
    Java标签跳转:一个鲜为人知但却很实用的小技巧
    多智能体系统论文速读
  • 热门文章
  • 十款代码表白小特效 一个比一个浪漫 赶紧收藏起来吧!!!
    奉劝各位学弟学妹们,该打造你的技术影响力了!
    五年了,我在 CSDN 的两个一百万。
    Java俄罗斯方块,老程序员花了一个周末,连接中学年代!
    面试官都震惊,你这网络基础可以啊!
    你真的会用百度吗?我不信 — 那些不为人知的搜索引擎语法
    心情不好的时候,用 Python 画棵樱花树送给自己吧
    通宵一晚做出来的一款类似CS的第一人称射击游戏Demo!原来做游戏也不是很难,连憨憨学妹都学会了!
    13 万字 C 语言从入门到精通保姆级教程2021 年版
    10行代码集2000张美女图,Python爬虫120例,再上征途
小工具 小游戏
Copyright © 2022 侵权请联系2656653265@qq.com    京ICP备2022015340号-1

京公网安备 11010502049817号