为您找到搜索结果：815个
css案例学习之div a实现立体菜单
效果代码<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><title>立体菜单</title><style>#menu{/*对menu层设置*/font-family:Arial;/*字体*/font-size:14px;/*字号*/}#menua,#menua:visited{text-decoration:none;/*文字无下划线*/text-align:center;/*文字水平居中对齐*/color:#fff;/*白色文字*/display:block;/*设置为块级元素*/width:10em;/*宽度*/padding:0.25em;/*内边距*/margin:0.5emauto;/*菜单项之间间隔0.5em，并水平居中*/bac...
css案例学习之双斜角横线菜单
效果代码<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><title>双斜角横线菜单</title><style>#menu{/*对menu层设置*/width:9em;/*宽度*/margin:0auto;/*水平居中*/font-family:Arial;/*字体*/font-size:14px;/*字号*/border:solid1px#aaa;/*细灰色边框*/}#menua,#menua:visited{/*设置菜单选项*/display:block;/*设置为块级元素*/text-decoration:none;/*无下划线*/color:#000;/*黑色文字*/height:1.4em;/*高度*/border:0.5emsol...
css案例学习之div+a实现菜单
效果代码<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><title>基本菜单</title><style>/*对menu层设置*/#menu{font-family:Arial;font-size:14px;width:120px;/*固定宽度才可以和margin结合使用*/padding:8px;background:#ccc;/*margin:0auto;*/border:1pxsolid#ccc;}/*设置菜单选项*/#menua,#menua:visited{display:block;/*必须是block，否则宽度高度都无效*/background-color:#fff;padding:4px8px;color:#000;text-...
css案例学习之div ul li a 实现导航效果
效果代码<html><head><title>无需表格的菜单</title><style>body{background-color:#dee0ff;}#navigation{width:150px;font-family:Arial;font-size:14px;text-align:right}#navigationul{list-style-type:none;/*不显示项目符号*/margin:0px;padding:0px;}#navigationli{border-bottom:1pxsolid#9F9FED;/*添加下划线*/}#navigationlia{display:block;height:1em;padding:5px5px5px0.5em;text-decoration:none;border-left:12pxsolid#151571;/*左边的粗边*/border-right:1pxsolid#151571;/*右侧阴影*/}#navigationlia:link,#navigationlia:v...
css案例学习之按钮超链接
效果 css实现<html><head><title>按钮超链接</title><style>a{/*统一设置所有样式*/font-family:Arial;font-size:.8em;text-align:center;margin:3px;}a:link,a:visited{/*超链接正常状态、被访问过的样式*/color:#A62020;padding:4px10px4px10px;background-color:#ecd8db;text-decoration:none;border-top:1pxsolid#EEEEEE;/*边框实现阴影效果*/border-left:1pxsolid#EEEEEE;border-bottom:1pxsolid#717171;border-right:1pxsolid#717171;}a:hover{/*鼠标经过时的超链接*/color:#821818;/*改变文字颜色*/padding:5px8px3px12px;/*改变文字位置*/background-color:#...
css案例学习之relative与absolute
代码<!DOCTYPEhtmlPUBliC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><title>absolute属性</title><styletype="text/css">body{margin:20px;font-family:Arial;font-size:12px;}#father{background-color:#a0c8ff;border:1pxdashed#000000;padding:15px;position:relative;}#fatherdiv{background-color:#fff0ac;border:1pxdashed#000000;padding:10px;}#block2{position:absolute;top:0px;right...
css+div布局案例
给最外层的div命名一个class有针对性的进行css布局。<divclass="joinus-info"><divclass="form-title">填写表格</div><formaction="{sh::U('Index/joinus')}"class="smart-green"onsubmit="returncheckform();"method="post"id="myform"><tablewidth="100%"border="0"cellspacing="0"cellpadding="0"class="addTable"><tr><tdheight="48"align="right"><strong>姓名：</strong></td><tdcolspan="3"class="lt"><inputtype="text"name="name"id="name"class=""size="45"value=""/></td>...
thinkPHP模板引擎案例
1.if<ifcondition="$vo.businesseqLS">零售<elseifcondition="$vo.businesseqCY"/>餐饮<else/>其他</if>编译后<?phpif($vo["business"]==LS):?>零售<?phpelseif($vo["business"]==CY):?>餐饮<?phpelse:?>其他<?phpendif;?>2.使用函数{sh:$vo.time|default=time()|date='Y-m-dH:i:s',###}编译后<?phpecho(date('Y-m-dH:i:s',($vo["time"])?($vo["time"]):time()));?>通常来说函数的第一个参数就是前面的变量或者前一个函数调用的返回结果，如果你的变量并不是函数的第一个参数，需要使用定位符号，例如：{$create_time|date="y-m-d",###}编译后<?phpecho(date("y-m-d",$crea...
css案例学习之float浮动
代码：<!DOCTYPEhtmlPUBliC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><title>float属性</title><styletype="text/css">body{margin:15px;font-family:Arial;font-size:12px;}.father{background-color:#ffff99;border:1pxsolid#111111;padding:5px;}.fatherdiv{padding:10px;margin:15px;border:1pxdashed#111111;background-color:#90baff;}.fatherp{border:1pxdashed#111111;background-color...
css案例学习之父子块的margin
两边还会有些距离，这是body默认的。代码：<head><title>父子块的margin</title><styletype="text/css">/*body{margin:00;}*/div.father{/*父div*/background-color:#fffebb;text-align:center;font-family:Arial,Helvetica,sans-serif;font-size:12px;padding:10px;border:1pxsolid#000000;}div.son{/*子div*/background-color:#a2d2ff;margin-top:30px;margin-bottom:0px;padding:15px;border:1pxdashed#004993;}</style></head><body><divclass="father"><divclass="son">子div</div></div>&...
css案例学习之div与span的区别
代码：<html><head><title>div标记范例</title><styletype="text/css">div.widthstyle{font-size:18px;/*字号大小*/font-weight:bold;/*字体粗细*/font-family:Arial;/*字体*/color:#FFFF00;/*颜色*/background-color:#0000FF;/*背景颜色*/text-align:center;/*对齐方式*//*width:300px;*//*块宽度默认宽度为一行，两边有点距离*/height:100px;/*块高度*/margin-top:10px;}span{font-size:18px;/*字号大小*/font-weight:bold;/*字体粗细*/font-family:Arial;/*字体*/color:#FFFFFF;/*颜色*/background-color:#0000FF;/*背景颜色*/text-align:center;/*对齐方式*/width:300px;/*块...
css案例学习之盒子模型
定义：每个盒子都有：边界、边框、填充、内容四个属性；每个属性都包括四个部分：上、右、下、左；这四部分可同时设置，也可分别设置；里的抗震辅料厚度，而边框有大小和颜色之分，我们又可以理解为生活中所见盒子的厚度以及这个盒子是用什么颜色材料做成的，边界就是该盒子与其它东西要保留多大距离。案例代码：<!DOCTYPEhtmlPUBliC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>盒子模型的演示</title><styletype="text/css">body{margin:0000;font-family:宋体;font-size...
css案例学习之层叠样式
代码<html><head><title>层叠特性</title><styletype="text/css">p{color:green;}.red{color:red;}.purple{color:purple;}/*这里的顺序是关键*/#line3{color:blue;}</style></head><body><p>这是第1行文本</p><!--绿色--><pclass="red">这是第2行文本</p><!--红色--><pid="line3"class="red">这是第3行文本</p><!--蓝色/先执行class样式，再执行id样式--><pstyle="color:orange;"id="line3">这是第4行文本</p><!--橙色/先执行id样式，再执行style样式--><pclass="redpurple">这...
css案例学习之继承关系
代码<html><head><title>继承关系</title><style>body{color:blue;/*颜色*/text-decoration:underline;/*下划线*/}em{color:red;/*颜色*/}</style></head><body><h1><em>前沿</em>教室</h1><p>欢迎来到前沿教室，这里为您提供丰富学习内容。</p><ul><li>在这里，你可以学习到：<ul><li>HTML</li><li>CSS<ulclass="css"><li>CSS初级</li><li>CSS中级</li><li>CSS高级</li></ul></li><li>Javascript</li&...
css案例学习之全局声明*{} 与body{}的区别
代码<html><head><title>全局声明</title><styletype="text/css">*{/*全局声明*/color:purple;/*文字颜色*/font-size:15px;/*字体大小*/}h2.special,.special,#one{/*集体声明*/text-decoration:underline;/*下划线*/}</style></head><body><h1>全局声明h1</h1><h2class="special">全局声明h2</h2><h3>全局声明h3</h3><h4>全局声明h4</h4><h5>全局声明h5</h5><p>全局声明p1</p><pclass="special">全局声明p2</p><pid="one">全局声明p3</p></b...