随笔分类 -  div+css

中文字体在css中所对应的英文、unicode
摘要:Mac OS 华文细黑 STHeiti Light [STXihei] \534E\6587\7EC6\9ED1 华文黑体 STHeiti \534E\6587\9ED1\4F53 华文楷体 STKaiti \534E\6587\6977\4F53 华文宋体 STSong \534E\6587\5B8B\4F53 华文仿宋 STFangsong \534E\6587\4EFF\5B8B 丽黑 Pro LiHei Pro Medium \4E3D\9ED1 Pro 丽宋 Pro LiSong Pro Light \4E3D\5B8B Pro 标楷体 BiauKai \6807\6977\4F53 阅读全文

posted @ 2012-08-12 10:39 郑志伟 阅读(281) 评论(0) 推荐(0) 编辑

div+css之清除浮动
摘要:当元素有浮动属性时,会对其父元素或后面的元素产生影响,会出现一个布局错乱的现象,可以通过清除浮动的方法来解决浮动的影响。浮动的清理(clear):值:none:默认值。允许两边都可以有浮动对象;left:不允许左边有浮动对象;right:不允许右边有浮动对象;both:左右两侧不允许有浮动对象。清除浮动的方法:1.额外标签法这种方法应该是最简单的一种了,w3c建议在容器的末尾增加一个“clear:both"的元素强迫容器适应它的高度以便装下所有的float元素。<div id="main"> <div id="left"> 阅读全文

posted @ 2012-08-12 10:35 郑志伟 阅读(26310) 评论(0) 推荐(0) 编辑

css在各大浏览器的兼容性问题收集
摘要:1.当加了doctype<img /> 标签的alt属性在ie8或以上不生效,所以推荐使用title属性。2.什么情况下使用id选择器或class选择器id选择器复用性比较低,优先级比较高,唯一使用,所以如果某个样式只是给某一个html元素使用,则选择id选择器,如果一个样式可能给多个html元素使用,则应当使用class选择器。3.a:link 在ie5,6下无效可以直接使用a{...}4.IETest工具,也有一个兼容性问题,在win7下,打不开ie6。可以下载绿色版的ie6,不用安装直接用的那种。5.在嵌套div中,如果外层div没有设置边框,内层div的margin-top 阅读全文

posted @ 2012-08-12 10:33 郑志伟 阅读(1053) 评论(0) 推荐(0) 编辑

css控制文字
摘要:这里列出的都是一些常用的属性。1.设置字体样式font-style:normal(正常) italic(斜体)2.修饰文字text-decoration:none(正常) underline(下划线) overline(上划线) line-through(删除线)3.字符间距letter-spacing:normal(默认) length(长度单位)4.单词间距word-spacing:normal(默认) length(长度单位)5.设置文本缩进text-indent:2em 可以为负值6.文本水平对齐方式text-align:left/center/right;7.对象中空白处理white 阅读全文

posted @ 2012-08-12 10:32 郑志伟 阅读(559) 评论(0) 推荐(0) 编辑

div+css之浮动
摘要:浮动:在div+css中,浮动分为左浮动,右浮动,清除浮动。1.右浮动所谓右浮动,指一个块元素向右移动,让出自己的空间,直到碰到包含自己的父元素的最右边的边框。2.左浮动某个块元素尽量向左移动,这样就可以让出它右面的空间,让别的块元素显示3.浮动的特别说明如果浮动元素的高度不同,那么当它们向下移动时可能被其他浮动元素“卡住”,直到有足够的空间。特别强调:浮动对块元素和行内元素都生效。4.如果使用浮动属性,不管是块元素和行内元素,都会按display: block;来显示。 阅读全文

posted @ 2012-08-12 10:30 郑志伟 阅读(278) 评论(0) 推荐(0) 编辑

div+css之定位
摘要:1.相对定位(relative)所谓相对定位是指,相对该元素应当显示的左上角重新定位,虽然它脱离了标准流,但它原来的空间不能被占用。2.绝对定位(absolute)所谓绝对定位是指,对该元素最近的那个脱离了标准流的元素(父元素)定位,如果没有父元素(或者有父元素,但父元素没有脱离标准流),则相对body左上角定位。3.固定定位(fixed)所谓固定定位,就是不管怎样,总是以视窗的左上角定位。注意:left,top对static静态定位无效。static定位是靠margin-left和margin-top来定位的。4.z-index用于设置对象(div)显示的时候,层叠的属性,z-index值越 阅读全文

posted @ 2012-08-12 10:28 郑志伟 阅读(617) 评论(0) 推荐(0) 编辑

关于浮动在不同浏览器的兼容性
摘要:1 <!DOCTYPE html 2 PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 <html xmlns="http://www.w3.org/1999/xhtml"> 5 <head> 6 <title>浮动布局</title> 7 <meta name="keywords" 阅读全文

posted @ 2012-08-11 11:12 郑志伟 阅读(497) 评论(0) 推荐(0) 编辑

div+css第四天
摘要:一、css特性1.继承子元素会继承父元素的某些样式,因为有些子元素本身就有默认的样式。2.层叠子元素如果定义了与父元素相同的样式,会覆盖掉父元素的样式。二、css的一些使用小技巧1.就一个比较特殊的字体想用,怎么办? 将其转为图片。分中英文字体。设置字体的顺序。将英文字体设置在前,中文在后。2.想让文字在垂直方向上居中显示,将行高设置为元素的高度,行高(line-height)==元素高度.注意:******文字的内容不能超过元素的宽度,也就是不能换行。这时候可以把元素的宽度设长一点就可以解决该问题。3.css可以重新设置xhtml标签的默认样式,如h1默认加粗。4.导入式样式:也就是将样式写 阅读全文

posted @ 2012-08-08 10:33 郑志伟 阅读(241) 评论(0) 推荐(0) 编辑

理解结构与表现相分离
摘要:1.什么是W3C?我们平时所说的W3c,其实是World WideWeb Consortium的缩写,中文是W3C组织或万维网联盟,它主要是做什么的呢?简单的说,就是出网页标准的。那么由W3C组织推出的标准就被成为Web标准。2.什么是web标准?首先,web标准不是指某一个标准,它是由W3C和其他标准化组织指定的一系列标准的集合。包含我们所熟悉的HTML,XHTML,Javascript,以及Css等。3.Web标准的目的?在于创建一个统一的用于Web表现层的技术标准,以便于通过不同浏览器或终端设备向最终用户展示信息内容。4.采用标准的好处 提高页面的浏览速度,使用css方法,比传统的web 阅读全文

posted @ 2012-08-08 09:12 郑志伟 阅读(1636) 评论(0) 推荐(0) 编辑

css之font属性
摘要:font 简写属性在一个声明中设置所有字体属性。注释:此属性也有第六个值:"line-height",可设置行间距。说明这个简写属性用于一次设置元素字体的两个或更多方面。使用 icon 等关键字可以适当地设置元素的字体,使之与用户计算机环境中的某个方面一致。注意,如果没有使用这些关键词,至少要指定字体大小和字体系列。可以按顺序设置如下属性:font-style 规定字体的样式font-variant 规定字体异体font-weight 规定字体的粗细font-size/line-height 固定字体尺寸和行高font-family 规定字体系列可以不设置其... 阅读全文

posted @ 2012-08-01 13:03 郑志伟 阅读(282) 评论(0) 推荐(0) 编辑

css之background属性
摘要:background 简写属性在一个声明中设置所有的背景属性。可以按顺序设置如下属性:background-color 背景颜色background-image 背景图片background-repeat 如何重复背景图片background-attachment 背景图片是否固定或者随着页面的其余部分滚动background-position 规定背景图像的位置如果不设置其中的某个值,也不会出问题,比如 background:#ff0000 url('smiley.gif'); 也是允许的。通常建议使用这个属性,而不是分别使用单个属性,因为这个属性在较老的浏览器中... 阅读全文

posted @ 2012-08-01 12:40 郑志伟 阅读(237) 评论(0) 推荐(0) 编辑

div+css第三天
摘要:一、行内元素和块元素行内元素(inline element),又叫内联元素:内联元素只能容纳文本和其他内联元素。常见的内联元素有:<span>,<a>,<input>块元素(block element):块元素一般都从新行开始,可以容纳文本,内联元素和其他块元素,即使内容不能占满一行,块元素也要把整行占满。常见的块元素有:<div>,<p>二、案例运行效果:从案例我们可以看出,行内元素只占能显示自己内容的宽度,不会占满整行;而块元素不管内容有多少,都会占满整行。三、行内元素和块元素的区别1.行内元素只占内容的宽度,块元素不管内容多少要 阅读全文

posted @ 2012-07-19 08:15 郑志伟 阅读(514) 评论(0) 推荐(0) 编辑

div+css第二天
摘要:一、css选择器的优先级行内选择器>id选择器>class选择器>html选择器>通配符选择器我们可以采用!important语法来提升重要性(优先权),例如:p{background-color:red !important(ie6下不支持);background-color:green;}如果是这样: 1 <style type="text/css"> 2 p{color:blue !important;} 3 .ps{ 4 color:red; 5 } 6 #p1{ 7 color:yellow; 8 } 9 </s... 阅读全文

posted @ 2012-07-18 22:42 郑志伟 阅读(322) 评论(0) 推荐(0) 编辑

div+css第一天
摘要:一、在没有出现div+css布局之前,我们都是用传统的table来布局的,但使用table来布局有这么几个缺点:1.显示的样式和数据绑定在一起,不利于维护和扩展2.布局的时候,灵活度不高3.一个页面会存在大量的<table>元素,如嵌套的表格,造成代码冗余4.增加带宽,针对那种大型网站来说,多一两百个字节一个月下来都是很可怕的开销5.不利于搜索引擎的优化但任何东西都是有两面性的,使用table布局有以下几个优点:1.简单,容易理解2.浏览器的兼容性比较好3.用来显示数据还是比较好的二、div基本思想数据和样式要分离三、div+css是什么?div+css是目前比较流行的一种网页布局 阅读全文

posted @ 2012-07-15 11:22 郑志伟 阅读(494) 评论(0) 推荐(0) 编辑

导航

点击右上角即可分享
微信分享提示