易截截图软件、单文件、免安装、纯绿色、仅160KB

css 引入方式与选择器

今天学习了css的引入方式和css的选择器
Css引入方式总共四种分别是:
1.<link rel=”realstyle” type=”text/css” href=”css.css”>
rel    表明连接的文件与html文档之间的关系
type 是表明文件类型
href 指向链接的css文件
2.在html文档的head部分直接写入css文档。
<style type="text/css">
div{margin: 0;padding: 0;border:1px red solid;}
</style>
3. 直接在html标签里写入对这个标签的css控制
Eg:<div style="border:1px red solid;">测试信息</div>
4.使用@import引入css文件
1:在head里使用的时候:
       <style type="text/css">
       @import url(my.css);
       </style>
2:在css文件里使用。
(@import本身是一个css命令。)
选择器总共有五种分别:
1.类选择器
在 CSS 中,类选择器以一个点号显示:
HTML:
<div class="test">测试代码</div>
CSS:
.test {color:red;border:1px blue solid;}
注意:类名的第一个字符不能使用数字!它无法在 Mozilla 或 Firefox 中起作用。
2.id 选择器
id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。
id 选择器以 "#" 来定义。
HTML:
<div id="test">测试代码</div>
CSS:
#test {color:red;border:1px blue solid;}
注意:id 属性只能在每个 HTML 文档中出现一次。
3.后代选择器
通过依据元素在其位置的上下文关系来定义样式,你可以使标记更加简洁。
HTML:
<div class="test">
       <span><img src="xxx" alt="示例图片"/></span>
</div>
CSS:
.test span img {border:1px blue solid;}
div span img {border:1px blue solid;}
 
4.群组选择器
CSS:
.test1,span,test2 {border:1px blue solid;}
div,span,img {border:1px blue solid;}
5.标签选择器
CSS:
div {color:red;border:1px blue solid;}
span {float:right;}
今天还学到了一些选择器的优先级的知识,感觉这些内容很容易的就理解了,不知道以后运用到实战中会怎么样,还是拭目以待,但是要想学牢固还是要通过大量的练习才能达到得心应手。
 


相关文档:

CSS 垂直居中

1.图片的垂直居中
  .box
{
/*非IE的主流浏览器识别的垂直居中的方法*/
display: table-cell;
vertical-align: middle; /*设置水平居中*/
text-align: center;

/* 针对IE的Hack */
*display:block;
......

关于div/css中设置flash透明的知识

、在Flash加入:<param name="wmode" value="opaque">
2、在DIV里加入:position:absolute;z-index:10;(数字越大越处于上层)
FLASH透明背景
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0 ......

CSS中元素水平居中显示的方法

用CSS让元素居中显示并不是件很简单的事情。同样的CSS居中设置在不同浏览器中的表现也各有千秋。本文就介绍了在CSS中常见的几种让元素水平居中显示的方法。
  1.使用自动外边距实现居中
  CSS中首选的让元素水平居中的方法就是使用margin属性—将元素的margin-left和margin-right属性设置为auto即可。在实际使用 ......

CSS网页布局的常用规范

CSS命名规范
一.文件命名规范
全局样式:global.css;
框架布局:layout.css;
字体样式:font.css;
链接样式:link.css;
打印样式:print.css;
二.常用类/ID命名规范
页 眉:header
内 容:content
容 器:container
页 脚:footer
版 权:copyright 
导 航:menu
主导航:mainMenu
子导航:su ......

magento 添加css js


magento个别页面添加css和js文件,可以将其放在个别页面的xml中,或者放在CMS的layout update中,其代码和文件存放位置如下
<reference name="head">
<action method="addCss"><stylesheet>css/mystyles.css</stylesheet></action>
//添加css mystyles.css 文件在 /skin/frontend/主题 ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号