zoukankan      html  css  js  c++  java
  • css框架学习

    css重新学习

    1.css的语法自行百度没什么可以说的。

    2.css的选择器

    (1)类选择器 :class用法是,.h1{color:red}

    (2)id选择器 :id用法是,#h1{height:300px}

    (3)符合选择器 : 用法是 .h1 img{height:400px; 300px}

    3.css的样式:

    背景,文本,字体,链接,表格

    背景:background-color

    文本:有一些不是常用的就不写了

    text-indent:1cm ;文本缩进1cm

    text-align :left,right,center;

    字体:font-size

    链接:

    a:link - 普通的、未被访问的链接

    a:visited - 用户已访问的链接

    a:hover - 鼠标指针位于链接的上方

    a:active - 链接被点击的时刻

    表格:

    css部分代码实现表格的

    table,td,th{
                border: 1px solid black;
            }
            table{
                 100%;
            }
            th{
                 50px;
            }

    html代码实现页面的内容的。

    <table>
    <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    </tr>
    <tr>
    <td>Bill</td>
    <td>Gates</td>
    </tr>
    <tr>
    <td>Steven</td>
    <td>Jobs</td>
    </tr>
    </table>

    4.盒子模型主要涉及到有margin,padding,border3个大块组成。

    margin:主要是负责外边距的

     margin-top: 30px;    //上边距30px
     margin-left: 30px;  //左边距30px
     margin-right: 30px;   //右边距30px
     margin-bottom: 30px;   //下边距30px
    padding:负责内边距的,与外边距不同,padding不是只能完全透明的,可以设置背景颜色和图片
     padding-left: 10px;
     padding-top: 10px;
     padding-right: 10px;
     padding-bottom: 10px;
    border:最基本的,border像margin和padding一样可以分别对每一条边进行设置,也可以使用简写属性border进行设置。
    border-top:上边界
    border-bottom:下边界
    border-left:左边界
    border-right:右边界
    如果想学习的更深入一些的推荐别的博主写的博客,本人主要是1.做一些笔记没事的时候抽空看看2.分享一下自己的学习思路和想法。3.基本上这些东西
    他们都是有一个框架的我也把一些常用的工作中常用css和html的一些元素写了进来,纯给小白学习前段看的,也是基础的知识模块。
    最后补充下还没有写完的知识点
    在css中还有一个是定位的问题:
    absolute:生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。
    fixed:生成绝对定位的元素,相对于浏览器窗口进行定位,这个是固定定位方式。
    relative:生成相对定位的元素,相对于其正常位置进行定位。
    浮动的问题:基本就是在下面那几个属性其余的按照需求来吧
    float:left、right、none
     


  • 相关阅读:
    扩展欧几里得算法
    Warshall算法
    自己的博客
    使用forever运行web项目
    C#语言基础 Main 函数中的输出输入
    新手第一天学习 C#语言(进制互换)
    Django + Uwsgi + Nginx 实现生产环境部署1
    基于Flask的web微信
    python保存文件UnicodeEncodeError以及reload(sys)后print失效问题
    轮询/长轮询
  • 原文地址:https://www.cnblogs.com/qijiang123/p/12153958.html
Copyright © 2011-2022 走看看