zoukankan      html  css  js  c++  java
  • 网页布局与样式

    1、布局

        不要使用<table>进行布局,因为:table可能会在所有tr、td加载完成以后才显示,所以加载完成之前界面是一片空白;用table布局会将布局方式写在html中,违反了“语义性”原则;用table会影响搜索引擎的抓取,不利于SEO。因此Table用来表达真是表格状数据的东西,布局用Div(层)+Css来做,Div用来圈定元素,CSS用来定义元素的位置。
       Div+CSS就是将要布局的内容用<div>切成块,然后使用css描述每个块的大小、位置等。
    2、样式
    ldisplay:元素是否显示,可选值none(不显示)、block (显示为块级元素,此元素前后会带有换行符。)、inline(显示为内联元素,元素前后没有换行符 )等。
    lcursor,鼠标在元素上时显示的光标图标,可选值:cursor(默认光标)、pointer(超链接上的手)、text(输入Bean)、wait(忙沙漏)、help(帮助)等。
    lLI不显示圆点:LIST-STYLE-TYPE: none;一般设在li或者ul上。
    l应用:图片:不显示边框,见备注。
    3、CSS浮动
    l浮动
    Ø在使用div布局的时候,发现每个div都是按照块的方式出来的,不利于页面的布局,所以CSS就提出元素的浮动技术,可以使得块元素在浮动的情况下在同一行中出现。
    l特点
    Ø元素在浮动的时候遇到父容器的边框就会卡住
    Ø如果子元素和父元素同时向相反的方向浮动,那么先浮动父元素,然后子元素在父亲元素的内部浮动
    Ø如果父元素没有浮动而且包含了浮动的子元素,那么浮动的元素就会脱离文档流(重点)
     
     4、lz-index
    Ø    CSS 中的 z-index 属性用于设置节点的堆叠顺序, 拥有更高堆叠顺序的节点将显示在堆叠顺序较低的节点前面, 这是我们对z-index 属性普遍的认识.
    l注意
    Øz-index只能作用在已经定位的元素对象上。
    Ø使用javascript控制这种使用”-”作为连接符的样式属性时必须使用驼峰的命名方式:
    var element = document.getElementById(”box”); 
    element.style.position = “relative”; 
    element.style.zIndex = “9999″;
     
     
  • 相关阅读:
    java -inally转
    11.Android-Xml读写
    10.Android-SharedPreferences使用
    9.Android-读写SD卡案例
    8.Android-简单的登录案例编写
    7.Android-压力测试、单元测试、日志猫使用
    python 向mysql中存储图片以及读取图片
    Android Studio 4.0+ 中新的 UI 层次结构调试工具
    微信小程序又放大招,代码包的大小限制由1M扩到2M
    硅谷禁书全集(5册)- 带完整封面目录,全面优化版
  • 原文地址:https://www.cnblogs.com/kuugachen/p/3554173.html
Copyright © 2011-2022 走看看