• css2基础知识梳理


    基础的css知识,只放XMind的截图。

    css01

    css02

     

    css03

    css04

    css05

    • css+div布局是前端的基本功,要多多练习。运用标准流、浮动、定位、层级等,做简单的静态页面。一定多多练习,提高代码熟练度,和布局分析能力。
    • 小项目练习,要清晰每一步的做法,比如先让元素实例化,然后去填充内容。
    • 对于一些零碎的css+div,多看看笔记。

    【转 via.wang】布局中所遵循的规范或是通例

       一般是遵循从上到下,从左到右的一个顺序。从页面的稳定性上来说,优先考虑使用标准流,其次考虑浮动或定位。

       遵循标准流的元素中,又以宽高最稳定,先把大的框架实例化出来,再进行细节的布局。能用padding的优先考虑padding,其实才考虑margin。如果没有margin的边距合并或是共享的问题话,也是可以比较愉快的使用margin的。

       我们网页的布局其实就像是在搭积木。将一块块的盒子组合在一块,使其呈现一个漂亮的页面效果。Html中任何一个元素都可以看成一个盒模型,都有宽高,内外边距。

    但行内元素的宽高不起作用,只有块级元素的宽高有效。行内元素的左右边距是起效果的。为了让行内元素也可能拥有宽高,可以有两种办法:

        第一种是让行内元素转换成块级元素或是行内块元素,代码如下:

          display: block;

          display: inline-block;

        第二种是给行内元素添加浮动或是定位,浮动或是定位了的元素脱离标准流的控制了,就会自动的拥有宽高的效果。

          用到的块级元素有: div, p, ul,li,dl,dt,dd,h1,h2,h3

          用到的行内元素有: span,a,del,em,i,s

          用到的行内块元素有:img,input,button 注意行内块元素相邻排列默认有几像素的间距,只能通过浮动解决这个问题。

  • 相关阅读:
    边缘检测算法——Canny和LoG边缘检测算法
    Java读书笔记03 输入输出
    CMake入门
    二叉树及二叉树的遍历
    Java读书笔记11 图形程序——颜色 字体 图像
    XNA实现骨骼动画 归纳总结
    Java读书笔记09 内部类
    Java读书笔记02 基础知识
    Java用户界面 模型视图控制器(MVC)模式
    简单理解传值和传引用
  • 原文地址:https://www.cnblogs.com/2010master/p/5698780.html
Copyright © 2020-2023  润新知