织梦dedecms修改模板默认css文件分析:首先，打开后台——模板——默认模板管理——index.htm.
看到有一句，说明，我们模板是根据这个CSS来布局网页的，于是我们就打开网站目录下面的templetsstylededecms.css.然后来分析一下CSS的构成。
我们根据主页的调用，来研究CSS这样容易理解。我们打开主页模板，找到：
立即学习“前端免费学习笔记（深入）”；
那么 w960 center clear mt1 都定义了什么呢？我们打开DEDECMS.CSS 找打相关的定义。
/*---------- stock ---------*/ .center{ margin:0px auto; 定义了CSS模块的边缘位置都是0，也就是这个center的层 距离上右下左都是0px;} .w960{ width:960px; 定义了整体的宽度为960px; /*position:relative;*/ } .pright .infos_userinfo { margin-bottom: 0px; 定义了首页右部下的 互动中心的下面边缘为0px;} .mt1{/* ( margin-top * 1 ) */ margin-top:8px; 定义了mt1的顶部边缘为8px;} .pright .mt1{ margin-top:0px; 定义了pright 下面的mt1顶部边缘为0px;} .mt2{/* ( margin-top * 2 ) */ margin-top:16px; 顶部边缘为16px;} .clear{ overflow:hidden; 如果clear层里面的内容超出了 层的范围 就隐藏起来。} 这个pleft 的定义 没有在dedecms.css 中，但是我们会发现一句话@import url("layout.css");@import url("page.css");这说明，在dedecms.css 中引用了 page.css 和layout.css 这两个样式表，于是我们就在page.css 中找到了pleft 的定义.pleft{width:712px;定义了宽度float:left;该层向左浮动overflow:hidden;超出范围则隐藏} 在该层下面调用的是新闻头条的内容，看看它的css.index .bignews{width:424px;height:400px;float:right; 向右浮动border:1px solid #DFF2F5;表示边框线用 #dff2f5的实体颜色填充background:url(../images/headbg-top.gif) repeat-x;背景图片为 headbg-top.gif 并且横向平铺overflow:hidden;超出则隐藏。}所以，我们看到头条的这部分是在flash幻灯片右边显示，并且加上了浅蓝色的边框线。 再来看看 onenews是如何定义的。 .index .bignews .onenews{margin:0 3px 0 3px; 左右外边距分别空3个像素padding:7px 6px;上左内边距分别空7，6个像素border-bottom:1px dashed #EBEBEB;下边框加一个 #ebebeb的虚线}所以我们看见头条的文章左右都有一定的距离，并且下面还有一个虚线显示 这个下面调用的是以往的头条，默认的有4篇文章，调用了d1 d1arc 2个css.index .bignews div.d1{padding:6px 10px;clear:both;这句话是清除浮动，如果不加它，大家可以试试看，是不是 d1 这个层就跑到 头条的右边了。width:406px;overflow:hidden;}.index .bignews div.d1arc{margin-right:12px;width:190px;float:left;因为此时要调用4篇文章，改文章是2*2排列的，如果不加这个属性，新闻就应该垂直排列了（因为你刚才用clear:both 清除浮动啦），大家试试看是不是这样的。height:24px;line-height:24px;行间距，即字体最底端与字体内部顶端之间的距离overflow:hidden;} 最新文章下面看看 newarticle 这个css吧，还是拿快学网的首页举例子，上面的这句是用来显示 “最近更新”那几个绿颜色字的，看看它是怎么定义的。 .index .bignews div.newarticle{height:24px; 高度background:url(../images/new-article.gif) 8px 3px no-repeat;背景图片在x轴8px 和y轴3px出出现font-size:0px;color:#fff;} 所以，我们能看到那个 最近更新 并且还有一个横条，其实它是个图片，大家右键图片另存为看看就知道了 这里面调用了 c2 和ico1 两个 css.index .bignews ul.c2{width:416px;padding:0px 4px 0px; 内边距为 上0 右4下0clear:both;清除浮动 和上面的意思一样overflow:hidden;}ico1 这个css 在layout.css 中了。.ico1 li{padding-left:16px; 指的是 新闻列表左内边距为16pxbackground:url(../images/ico-1.gif) 7px 11px no-repeat; 背景在7px,11px 处出现，所以我们看到最新文章的列表左边都有一个小黑点，这个小黑点就是 ico-1.gif}
到此，中部的头条新闻和最近更新已经分析完了。 看看flash的 css 定义.index .flashnews{width:280px;height:192px;overflow:hidden;float:left;这句决定了，flash 的新闻列表在 头条的左边显示。如果你把bignews 和flashnews 的float 属性互换一下应该是上面结果呢？大家试试看。} 这边是特别推荐调用的样式，还是来看看css.index .latestnews{width:280px;height:200px;margin-top:8px;float:left;}.index .latestnews dl dd{padding:2px 5px;}.index .latestnews ul a{color:#555;}
以上就是dedecms怎么修改css的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1614565.html
微信扫一扫
支付宝扫一扫
关于作者
相关推荐
-
css外部样式表怎么写
外部css样式(也可称为外联式)就是把css代码写一个单独的外部文件中，这个css样式文件以“.css”为扩展名，在 内（不是在标签内）使用标签将css样式文件链接到html文件内，如下面代码： 注意： 1、css样式文件名称以有意义的英文字母命名，如 main.css。 2、rel=”…
-
dw怎么创建css文件
在dreamweaver cc中可以直接创建css文件，或在内面内手写输入css代码定义规则等等。 如果要使用可视化css编辑，可以使用css设计器，在默认的界面下，在软件窗口右侧的活动窗口内就可以找到css设计器。 例如：新建一个html文件，点击css设计器的“源”窗口的“+”号，选择创建css…
-
css outline-color属性怎么用
轮廓是绘制于元素周围的一条线，位于边框边缘的外围。outline-color属性用于设置一个元素整个轮廓中可见部分的颜色。需始终在outline-color属性之前声明 outline-style 属性；元素只有获得轮廓以后才能改变其颜色。 css outline-color属性怎么用？ outli…
-
css类选择符用什么
在 css 中，类选择器以一个点号显示： .center {text-align: center} 在上面的例子中，所有拥有 center 类的 HTML 元素均为居中。 在下面的 HTML 代码中，h1 和 p 元素都有 center 类。这意味着两者都将遵守 “.centerR…
-
左浮动 css怎么写
css样式的float浮动属性，用于设置标签对象（如： 标签盒子、标签、标签、标签等html标签）的浮动布局，浮动也就是我们所说标签对象浮动居左靠左（float:left）和浮动居右靠右(float:right)。 float是什么意思？ float是浮动，翻译成中文也是浮动意思。 float的作用…
-
css text-indent属性怎么用
css text-indent属性用于规定文本块中首行文本的缩进；语法为text-indent : length | % 。该属性允许使用负值；如果使用负值，那么首行会被缩进到左边。 css text-indent属性怎么用？ text-indent 属性规定文本块中首行文本的缩进。 语法： 立即…
-
css 内阴影怎么做
css3 box-shadow 属性用来描述一个元素的一个或多个阴影效果，该属性几乎可以让你完成你想要的任何阴影效果。然而 box-shadow 属性语法和取值非常灵活，对于新手有点不容易理解。 模拟地址：https://www.html.cn/tool/css3Preview/Box-Shadow…
-
css white-space属性怎么用
css white-space 属性用于设置如何处理元素内的空白，例设置white-space: nowrap，则换行及行首尾空格全部被合并，文本不会换行，文本会在在同一行上继续，直到遇到 标签为止。 css white-space属性怎么用？ white-space 属性设置如何处理元素内的空白。…
-
css z-index属性怎么用
css z-index 属性用于设置元素的堆叠顺序；拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。该属性仅能在定位元素上奏效（例如：position:absolute, position:relative, or position:fixed）。 css z-index属性怎么用？ z-…
-
学html css看什么书？
我们在学习html+css的过程中我们可以看看一些大牛写的书籍，会受益匪浅。下面我将介绍几本关于css以及html的书籍，感兴趣的朋友可以了解一下。 1、《CSS那些事儿》 本书专注于CSS技巧实例的讲解，由浅入深地分析了CSS样式在布局时所需要理解的原理。绕开随处可见的基础知识、网络中能随意搜索到…
-
css怎么设置按钮样式
在许多网站中都需要实用到按钮，一个好看实用的css按钮即可以给访问者以美感，又可以方便开发者。下面就是一个纯css按钮，需要的可以参考一下。 1、button按钮（无样式） 默认按钮 2、button按钮（有样式） HTML代码： 立即学习“前端免费学习笔记（深入）”； 按钮 CSS部分： .bu…
-
css全称是什么意思
css的英文全称为cascading style sheets。几个单词拆开翻译，cascading有大量的意思，style有风格样式的意思，sheets有表格的意思，整合在一起翻译为中文意思为层叠样式表。 层叠样式表是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一…
-
css align-self属性怎么用
css align-self属性用于定义flex子项单独在侧轴（纵轴）方向上的对齐方式：拉伸以适应容器、位于容器的中心、位于容器的开头、位于容器的结尾、位于容器的基线上。 css align-self属性 align-self属性是Flexible Box Layout模块的子属性。 作用：定义fl…
-
css怎么设置字体为楷体？
本篇文章小编将和大家讲讲如何在css里设置字体为楷体，还有五类通用字体说明以及其他的字体样式表示，感兴趣的朋友可以看看，希望对你有所帮助。 CSS使用font-family属性来定义字体类型。css设置字体为楷体的语句为： font-family: “楷体”,”楷体_GB2312″; 习惯上中文网页…
-
什么是css（层叠样式表）？
css是 cascading style sheets（层叠样式表）的缩写，是一种用来表现html（标准通用标记语言的一个应用）或xml（标准通用标记语言的一个子集）等文件样式的计算机语言。 CSS主要用于设置网站外观，让我们的网站更加绚丽，引人注目；不仅可以静态地修饰网页，还可以配合各种脚本语言动…
-
CSS是用来做什么的?
css是一种用来表现html（标准通用标记语言的一个应用）或xml（标准通用标记语言的一个子集）等文件样式的计算机语言。 CSS主要用来设计网页的样式，美化网页；它不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。 CSS 能够对网页中元素位置的排版进行像素级精确控制，支…
-
CSS怎么引用外部ttf字体？
css如何引用外部字体？ 在CSS中可以使用font-face属性来引用外部字体，font-face属性可实现任何外部特殊字体的调用，例如：.ttf字体。 在新的 font-face 规则中，必须首先定义字体的名称（比如 myFirstFont），然后指向该字体文件。 如需为 HTML 元素使用字体…
