欢迎来到酱油妹!织梦模板,dede模板下载,织梦cms模板,免费网站模板下载站

酱油妹

酱油妹介绍织梦CMS的css

企业模板

其实,大量朋友不会CSS,假如把CSS精通了,美工就容易多了。我把自身概括的织梦DEDECSS全整理出来了。期望对你有所帮,见下:/*---------- import ---------*/ //调用外部CSS中调用外部CSS的语法是@import url("file.css");直接插入到CSS文件或<style></style>之间就好了。@import url("layout.css");@import url("page.css");/*---------- base ---------*/ //基本样式*{ //*,通用符 padding:0px; //对像间隔, margin:0px; //左右边距}html{ //所有html均适用此样式 background:#FFF;}body{ font:12px Verdana,Arial,Tahoma; //正文字体,字号}img{ border:none; //图片,不显示边框}a{//超链接 color:#3366CC; text-decoration:none; //表示没有下划线}a:hover{ color:#F33; text-decoration:underline; //表示有下划线的}ul{ list-style:none;}input,select,button{ font:12px Verdana,Arial,Tahoma; vertical-align:middle; //坚直上居中排列}/*---------- stock ---------*/.center{ //中间主体部分,导航栏处 margin:0px auto;}.w960{ width:960px; //中间主体宽度960 position:relative; //它可以随窗口大小变化}.mt1{/* ( margin-top * 1 ) */ //样式mt11,距顶端8PX margin-top:8px;}.mt2{/* ( margin-top * 2 ) */ margin-top:16px;}.clear{ overflow:hidden; //让浏览器窗口永远不出现滚动条}.fs-12{ font-size:12px;}.fc-f60{ color:#F60;}.fc-f90{ color:#F90;}.ipt-txt{ line-height:15px; padding:4px 5px; border-width:1px; border-style:solid; border-color:#666 #BBB #BBB #666; font-size:12px; margin-right:2px;}.btn-1{ width:56px; height:23px; border:none; background:url(../images/btn-bg1.gif) no-repeat; //不平铺,repeat-x为向上平铺 line-height:25px; //行高为 letter-spacing:1px; //文字间隔属性 overflow:hidden; color:#2F592E;}.btn-2{ width:70px; height:25px; border:none; background:url(../images/btn-bg2.gif) left top no-repeat; line-height:25px; overflow:hidden; color:#444; margin-right:2px;}.header{ width:100%; padding-top:16px; overflow:hidden;}.header a{ color:#777;}.header a:hover{ color:#390; text-decoration:none;}.header .top{ clear:both; overflow:hidden;}.header .title{ float:left; padding-left:16px;}.header .title h3 a{ width:200px; height:56px; display:block;// 可以理解为块。把这个地区变成块状。当然你加了宽度和高度成效不明显了。假如去掉宽度和高度试试。再去掉display试试就发现问题了 font-size:0px; text-indent:-200px; overflow:hidden; background:url(../images/top-logo.gif) center center no-repeat; //logo大小}.header .banner{ width:480px; height:56px; float:left; margin-left:40px; overflow:hidden; //顶部图片}.header .banner img{ width:480px; height:56px; display:block;}.header .rlink{ width:172px; height:52px; float:left; margin-left:32px; overflow:hidden; padding-top:4px;}.header .rlink ul li{ width:78px; height:21px; background:url(../images/toprlink-bg.gif) left top no-repeat; //“收藏”等一些图标 float:left; margin-right:8px; margin-bottom:8px; overflow:hidden;}.header .rlink ul li a{ display:block; color:#777; line-height:21px; text-indent:22px; background-image:url(../images/toprlink-bg.gif); background-repeat:no-repeat;}.header .rlink ul li a:hover{ color:#000;}.header .rlink ul li.r1 a{ background-position:0px -21px; //背景位置:100% -12px }.header .rlink ul li.r2 a{ background-position:0px -42px;}.header .rlink ul li.r3 a{ background-position:0px -63px;}.header .rlink ul li.r4 a{ background-position:0px -84px;}.header .welcome{ float:right; margin-top:20px; padding-right:10px; color:#999;}.header .welcome a{ margin:0px 3px; }.header .nav{//导航栏 width:100%; height:32px; background:url(../images/nav-bg.gif) repeat-x; //水平上平铺,导航栏背景图片 clear:both; overflow:hidden;}.header .nav ul{ height:32px; margin:0px auto; overflow:hidden;}.header .nav ul li{ float:left; line-height:31px; background:url(../images/nav-bg.gif) 0px -32px no-repeat; margin-left:-2px;}.header .nav ul li a{ height:32px; padding:0px 16px 0px 17px; display:block; color:#FFF; float:left;}.header .nav ul li a:hover{ color:#FF3; }.header .search{ height:40px; background:url(../images/search-bg.png) repeat-x; clear:both;}.header .search .form{ padding-left:8px; 左部离8 padding-top:5px; //顶部离5 float:left; //从左开如排}.header .search .form h4{ display:none; //文字已经变成块状了}.header .search .form input.search-keyword{ width:156px; height:18px; border:none; background:url(../images/search-bg.gif) left top no-repeat; line-height:15px; font-size:12px; padding:5px 3px 0px 58px; overflow:hidden;}.header .search .form select.search-option{ margin-left:2px;}.header .search .form button.search-submit{ //搜索按键的大小及样式 width:68px; height:22px; border:none; background:#F00 url(../images/search-bg.gif) right top no-repeat; font-size:0px; line-height:100px; margin-left:2px; *margin-left:5px; overflow:hidden;}.header .tags{ float:left; margin-left:16px; padding-top:8px;}(责任编辑:酱油妹)


希望以上内容可以解决您的问题!
如有其他问题欢迎大家一起交流学习!
作者:酱油妹 来源:互联网 关注: 时间:2020-08-28 02:51
版权声明:凡注明来源为www.jiangyoumei.com的均为本站原创,转载请注明来源。
本文网址:http://www.jiangyoumei.com/jiaocheng/shiyong/20200828/9626.html
►凡本站提供教程均已验证教程的准确性。
►为提高用户在织梦后台添加栏目的灵活性(可随意添加/删除栏目),并保持(管理后台添加/删除栏目)与前端网站栏目的一致,本站模板中栏目均未固定,用户直接搜索typeid=''并替换''中的数字为所需栏目id即可。
►本站提供各种类型织梦模板!希望在这里找到喜欢的。下载本站模板,用户直接替换相关文字和图片即可。
►本站仅提供织梦模板即(DEDE模板),(除另外说明)均不带织梦安装程序及数据,用户直接覆盖默认模板即可。
►本站所有资源(包括源码、模板、插件等)仅供学习与参考,请勿用于商业用途。
►如有其他问题,请加网站客服QQ(375750496)进行交流。
相关织梦教程
在线客服

织梦模板 整站模板 新手教程 使用技巧