• 2016年10月31日 样式的格式与布局


    上午讲了样式属性的大小,背景,字体,对齐方式,边界边框。
    body里面代码为
    <body>
    <div style=" font-family:微软雅黑; font-size:36px; font-weight:bold; font-style:italic; color:#F00; text-decoration:line-through">hhhh
    </div>
    <div id="a1">ad
    <div id="a2">
    </div>
    <br />
    </div >
    <br>
    <div id="c">百度一下
    </div>

    </body>
    head里面代码为
    <style type="text/css">
    *{ margin:0px auto; padding:0px}
    #a1{ 200px; height:300px;
    background-color:#C00;


    }
    #a2{ 100px; height:100px; background-color:#00C;
    margin:auto;
    text-align:left

    }
    #c{ width :200px; height:80px; background-color:#00C; font-size:16px; text-align:center; vertical-align:middle;
    line-height:80px

    </style>
    所呈现出的效果为。。

    下午学习了格式与布局。

    1.位置:position
    fixed固定
    相对于浏览器边框位置固定
    absolute绝对位置
    相对于父级元素(浏览器,绝对定位的上级)
    relative相对位置
    相对于自身应该出现的位置
    top
    距离上边的距离
    right
    距离右边的距离
    bottom
    距离下边的距离
    left
    距离左边的距离


    2.流
    float
    left
    向左流
    right
    向右流
    clear
    both
    清掉流
    3.z-index分层
    值越大越靠上


    4.其它
    display
    显示block和隐藏none,不占位置
    visibility
    显示visible和隐藏hidden,占位置
    overflow
    超出范围 hidden隐藏
    透明
    opacity:0.5;-moz-opacity:0.5;filter:alpha(opacity=50)
    圆角
    border-radius:5px;
    阴影
    box-shadow:0 0 5px white

  • 相关阅读:
    第 16 章 CSS 盒模型[下]
    第 16 章 CSS 盒模型[上]
    第 15 章 CSS 文本样式[下]
    第 15 章 CSS 文本样式[上]
    第 14 章 CSS 颜色与度量单位
    第 13 章 CSS 选择器[上]
    第 12 章 CSS 入门
    关于springboot上传文件报错:The temporary upload location ***is not valid
    Java Enum枚举 遍历判断 四种方式(包括 Lambda 表达式过滤)
    git命令-切换分支
  • 原文地址:https://www.cnblogs.com/F4natasy/p/6016235.html
Copyright © 2020-2023  润新知