作为前端开发人,经常头疼于雷鸣,标签,id名的命名,不知道应该基于什么原则. 原则: 2 当命名的时候,问自己,这个元素是要来做什么?(根据使用目的).ad-banner 4 避免依靠位置和视觉效果命名.如.red-link #left-column 3 使用更加直观的命名. 虽然#header 有点用location来命名,但是这基本都遵守,比用#branding更加直观 如果我问 bob 这个类,id是做什么的,他是否会自动知道 好处: 当你一个right-cloumn想移到左侧时,就会引起…
CSS语义化命名 从上图我们可以大概看出这里有两种CSS的命名方式:1.结构化命名法:2.语义化命名法. 结构化命名法:根据页面中板块的位置而命名,如上图中的content-left,这时如果我们想把侧边栏sidebar放在左边,那么这时content-left板块却在右边,板块位置与其命名完全不符,那么我们这时就要修改页面中的以及CSS样式中的选择器名字了,这样会很不方便,尤其是当页面结构复杂时,一会儿left,一会儿right,这样会很不容易维护. 语义化命名法:根据页面中模块的功能而命名,…
CSS语义化命名 从上图我们可以大概看出这里有两种CSS的命名方式:1.结构化命名法:2.语义化命名法. 结构化命名法:根据页面中板块的位置而命名,如上图中的content-left,这时如果我们想把侧边栏sidebar放在左边,那么这时content-left板块却在右边,板块位置与其命名完全不符,那么我们这时就要修改页面中的以及CSS样式中的选择器名字了,这样会很不方便,尤其是当页面结构复杂时,一会儿left,一会儿right,这样会很不容易维护. 语义化命名法:根据页面中模块的功能而命名,…
HTML 5的革新之一:语义化标签一节元素标签. 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式的id和class形容这块内容的意义).这些标签只是我们提供给浏览器的指令,只是定义一个网页的某些部分.但现在,那些之前没“意义”的标签因为因为html5的出现消失了,这就是我们平时说的“语义”. 看下图没有用div标签来布局 html5的布局 嗯,如上图那个页面结构没有一个div,都是采用html5语义标签(用哪些标签,关键取决于你的设计目标…
我们平常在用DIV+CSS制作html网页页面时,常会用到class 和id来选择调用CSS样式属性.对学习CSS的新手来说class和id可能比较模糊,同时不知道什么时候该用class,什么时候又用id,以及它们用法与限制是怎么样的. ID和class都是“钩子” 我们需要一个使用html/xhtml语言描述文档内容的方式,类似的基础元素有<h1>,<p>和<url>来完成这样的工作,但我们的基础标签不能覆盖网页元素和布局选择中的所有类型.因此我们需要ID和class…
类名 对象名=new 类名();类名 对象名 这个的解释是创建名称为"对象名"的"类名"类引用变量new ; 这个的解释是实例化对象类名() 这个的解释是无参数构造方法:new 类名();就是说以无参数构造方法实例化对象:类名 对象名=new 类名();用指针的解释就是以无参数构造方法实例化对象并将这个对象的内存引用赋给"类名"类的"对象名"引用变量…
ul ol li dl dt dd都是DIV+CSS做网页长用的东西,相当于一棵树的树技,下面就了解一下这些东西的全体用法,本人用dd,dt,dd用得很少,懂得结合使用对做架构是很有好处的哦! DIV CSS网页布局中常用的列表元素ul ol li dl dt dd释义,块级元素div尽量少用,和table一样,嵌套越少越好 ol 有序列表.<ol><li>……</li><li>……</li><li>……</li><…
转自:http://smallpig301.blog.163.com/blog/static/9986093201010262499229/ < dl>< /dl>用来创建一个普通的列表, < dt>< /dt>用来创建列表中的上层项目, <dd>< /dd>用来创建列表中最下层项目, < dt>< /dt>和< dd>< /dd>都必须放在< dl>< /dl>…
一.标签选择器 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <sty…
cursor CSS属性定义鼠标指针悬浮在元素上方显示的鼠标光标cursor:pointer: 小手 cursor:wait:等待....很多种 <span contenteditable="true">1</span> 为内容可修改 width 属性指定了元素内容区的宽度. 内容区在元素padding,border和margin里面.…