zoukankan      html  css  js  c++  java
  • 格式与布局

    width
    height
    background color 背景颜色
    background image 背景图片

    background repeat 背景图片平铺
    background position 背景图片位置 top bottom left right
    background-attachment 背景图是否随着滚动条动
    background-size:200px 200px 先写宽度的像素在写高度的像素

    <style type="text/css">
       #a{
    	   300px;
    	   height:1200px;
    	   background-color:#603;
    	   background-image:url(t0135c8a98de3472211.jpg);
    	   background-size:1000px 100px;
    	   background-repeat:no-repeat;
    	   background-position:center;
    	   background-attachment:fixed;
    	   
    	   ;}
    </style>
    </head>
    
    <body>
    <div id="a"></div>
    

    字体一般是 font开头

    font-size 字体大小
    font-family 字体
    普通的正文 一般为14像素 页脚一般是12像素 稍微大点的16,常用的三种
    字体颜色为 color

               font-size:24px;
    	   font-family:微软雅黑;
    	   color:#0F3;
    	   text-align:center;
    	   line-height:1200px;
    	   vertical-align:middle;

    对齐方式:
    text-align 水平对齐(文字)
    vertical-align:垂直对齐方式 middle top bottom 这个对齐方式需要配合line-height(行高)使用


    text-indent 首行缩进
    <a href="###" style="text-decoration:none">shouye </a> 去掉下划线


    外界与边框
    margin 这个元素与外边之间的距离
    margin-top 上边距 margin-left左边距 margin-bottom下边距 margin-right右边距
    也可以 margin 像素 像素 像素 像素;
    padding 内边距 代表与里边的距离
    boder 边框 solid实线
    border width 边框粗细
    border style
    border color
    边框的大小式计算在边框里的

    <style type="text/css">
    *{margin:auto}
    #b{ 600px;
        height:400px;
    	background-color:#3F3;
    	padding:20px;
    	border:#C66 solid 23px;}
    #aa{ 300px;
         height:100px;
    	 background-color:#69F;}	
    </style>
    </head>
    
    <body>
    <div id="b">
     <div id="aa"></div>
     </div>
    

     list-style:none 没有列表样式

    <style type="text/css">
    #menu{list-style:none;
    </style>
    </head>
    <body>
    <ol id="menu">
     <li>yingyu</li>
     <li>yuwen</li>
     <li>shuxue</li>
    </ol>

    position 位置 absolute 绝对定位 绝对定位是相对于浏览器的边界来说的
    配合 top bottom left right使用
    fixed 固定位置
    relative 相对定位(相对于该元素本该出现的位置)
    元素加了position后与原来的元素就不在同一层了
    div居中 可以 margin:0px auto;
    流式布局:用来做布局页面
    float:四个方向。

    #menu{ 800px;
           height:50px;
    	}
    .a{ 100px;
            height:50px; 
            float:left;
    		margin:10px;
    		background-color:#0F0;
    		text-align:center;
    		line-height:50px;
    		vertical-align:middle;
    	}
    
    </style>
    </head>
    
    <body>
    <div id="menu">
         <div class="a">shouye</div>
         <div class="a">xinwen</div>
         <div class="a">wenwen</div>
         <div class="a">kankan </div>
         <div class="a">ditu</div>
         <div class="a">tieba</div>       
       </div>
    

      

  • 相关阅读:
    阿凯
    hlg神秘植物--矩阵快速幂
    poj1185炮兵阵地--状态dp
    该怎么办
    hlg2096---状态压缩dp
    这个世界

    第三篇
    LCT板子
    spoj COT
  • 原文地址:https://www.cnblogs.com/gaofangquan/p/6979754.html
Copyright © 2011-2022 走看看