• 样式表


      今天学习了样式表,学习了很多内容,很多的小的内容,需要大量的记忆,对今天的学习,我做了以下的总结:

      一:首先是“内敛”是写在标签里面的,style="样式” 劣势:控制准确,代码重用性。

        “内嵌”是嵌在页面head里面,<style type=“text/css”></style>优点:控制虽然没有内联的精确,但是代码重用性好。

        “外部”单独的样式文件,引入:右键-css样式表-附加样式表。引入:<link href="text.css" rel="stylesheet" type="text/css">控制没有内联的精确,但是重用性好。

        选择器

        样式表用来选取元素的
        标签
        根据标签名选中元素
        class
        . (点)
        根据class名来筛选元素
        id:
        # (井号)
        根据id名来筛选出唯一元素
        复合
        并列div,span
        div,span
        class="第一种 第二种"
                后代  #list li
                #list li
              点筛选:div.s

        大小:width 宽度 height 高度

        背景:

                  background-color:背景色

                  background

         rgb(x,x,x)

         rgba(x,x,x,x)最后一个是透明度 1为不透明 0为全透明

         url(图片的相对路径)

         不平铺:no-repea

         background-image:背景图片

         background-repeat:背景图的平铺方式 no-repeat,不平铺,repeat平铺,repeat-x横向平铺,repeat-y纵向平铺。

         background-position:center;背景图片位置,设置背景图片时,repeat必须为no-repeat.

         background-attachment:设置背景图片是否滚动,fixed背景是固定的,不随字体滚动。scroll背景随字体滚动。

         background-size:200px 200px;背景图片的大小。

          字体:

         font-family:字体样式。

         font-size:14px 15px;字体大小

         font-style:italic倾斜

         font-weight:bold加粗

         text-decoration:underline下划线 overline上划线 overline上划线 line-through删除线 none没有,用来去掉超链接的下划线。

         color。字体颜色

        对齐方式:

          text-align:水平对齐方式

          vertical-align 垂直对齐方式,配合行高使用

          line-height  行高

          text-indent  缩进 单位像素

       边界边框:

          margin:
                     外边距 上右下左
                     padding:
                     内边距 上右下左 ,如果加了内边距,该元素会相应的变大
                   border:
                     1px solid #60F 简写方式 第一个边框粗细 第二个边框样式 第三个边框颜色
        列表方块

                     list-style

                     none将列表前面的序号去掉

                     list-style-image

                     可以将前面的序号变为图片

                     格式与布局
            位置
                     position

                     fixed固定 相对于浏览器边框位置固定

                     absolute绝对位置

                     相对于父级元素(浏览器,绝对定位的上级)

                     relative相对位置

                     相对于自身应该出现的位置

                     top 距离上边的距离

          right 距离右边的距离

          bottom 距离下边的距离

          left  距离左边的距离

       今天学习的内容很多,需要加强记忆的东西。课下多努力,多背,多记。加油吧!

  • 相关阅读:
    C
    如何让asp.net mvc 直接运行mobile页面
    Nuget找不到服务器
    C#调用R语言输出图片
    sql列转行
    C#读取注册表
    关于这个博客,关于我
    NOIP 2016 简要题解
    CSP2019 题解
    CF 练死劲
  • 原文地址:https://www.cnblogs.com/liuyubin0629/p/6832689.html
Copyright © 2020-2023  润新知