01、
《JSF視頻教程》exe
02、
Log4配置
03、
初探tomcat連接池
04、
Apache Derby簡單入門
05、
一個(gè)繼承類
06、
夠用一輩子的幾句話
07、
《大道至簡 》個(gè)人讀后雜談
08、
Java學(xué)習(xí)清單
09、
java讀取資源文件
10、
Struts2學(xué)習(xí)筆記
11、
From java.lang.reflect.Array source code To JVM
12、
Struts國際化處理(轉(zhuǎn))
13、
校園幽默
14、
食品笑話
15、
冷笑話
16、
常用網(wǎng)址
17、
窮人最缺少的是什么?
18、
如何使用Log4j?
19、
Hibernate Query對(duì)象
20、
常用查詢頁面
21、
ssh整合例子---struts、hibernate、spring+unit單元測試
22、
Java字符集<轉(zhuǎn)>
23、
動(dòng)物笑話 III[轉(zhuǎn)貼]
24、
技術(shù)挑戰(zhàn)——根據(jù)編碼函數(shù)寫出解碼函數(shù)
25、
從request獲取各種路徑總結(jié)
26、
一個(gè)很好的把java打包成exe的軟件
27、
垃圾收集機(jī)制(Garbage Collection)批判
28、
AWT/SWT/Swing大比較之一:模型設(shè)計(jì)與實(shí)現(xiàn)
29、
java 關(guān)閉IE
30、
譯文:35個(gè)導(dǎo)致你的博客冷清的理由
31、
用Javascript模擬Java的Set
32、
開發(fā)人員的洞房花燭夜
33、
人生少走彎路的十條忠告
34、
程序員四大忌
35、
如何成功運(yùn)用"蘑菇定律"?
36、
寫一個(gè)簡單的工作流(三)
37、
內(nèi)核中的List結(jié)構(gòu)
38、
JDK1.4引入的新特性之一--斷言(assert)
39、
最簡單的 AJAX 例子代碼(完整注釋)
40、
log4j.properties通用配置
41、
Java面試題
42、
設(shè)定lib包下所有的jar到classpath
43、
學(xué)習(xí)設(shè)計(jì)模式之我見(轉(zhuǎn))
44、
設(shè)計(jì)模式之Proxy——買票篇(轉(zhuǎn))
45、
JDBC連接數(shù)據(jù)庫經(jīng)驗(yàn)技巧
46、
Java編寫的模擬ATM取款機(jī)程序
47、
軟件技術(shù)(軟件工藝)
48、
DIV CSS網(wǎng)頁布局常用的方法與技巧
49、
練好項(xiàng)目管理
50、
Factory(工廠)模式
51、
TEA加密算法java版
posted @
2007-10-12 19:57 CoderDream 閱讀(281) |
評(píng)論 (0) |
編輯 收藏
01、
Java中static、this、super、final用法簡談 <原作者 : kevin>
02、
Ajax簡易開發(fā)框架
03、
ruby-lang上Ruby與Java的對(duì)比文章
04、
局域網(wǎng)中無法訪問的解決方法
05、
時(shí)間腳本收集
06、
《精通css高級(jí)web標(biāo)準(zhǔn)解決方案》資料
07、
2007年4月份-10月份項(xiàng)目備忘錄--2 敏捷首先要“看得見”
08、
HttpURLConnection使用中遇到的一個(gè)問題
09、
JAVA論壇
10、
快速保存網(wǎng)頁中所有圖片的方法
11、
javascript如何讀取自身文件內(nèi)的xml
12、
音樂網(wǎng)站大全
13、
職工可享受的假期及相關(guān)規(guī)定
14、
JRuby:集Java和RoR之所長
15、
通過javascritp對(duì)表格進(jìn)行列拖動(dòng)排序
16、
Spring用戶指南
17、
JavaScript應(yīng)用:Iframe自適應(yīng)其加載的內(nèi)容高度
18、
JavaScript框架編程
19、
JavaScript類的繼承
20、
Javascript事件設(shè)計(jì)模式
21、
JavaScript中支持面向?qū)ο蟮幕A(chǔ)
22、
javascript樹形結(jié)構(gòu)完全封裝
23、
javascript讀取xml
24、
JavaScrip高級(jí)應(yīng)用:操作模態(tài)與非模態(tài)對(duì)話框
25、
使用javascript+dom+xml實(shí)現(xiàn)分頁
26、
JavaScript接受URL參數(shù)的代碼
27、
由淺到深了解JavaScript類
28、
星星鼠標(biāo)特效(沒事的時(shí)候可以看看)
29、
使用String.split()方法時(shí)要注意的問題
30、
javascript38種小技巧,推薦新手查看
31、
關(guān)閉瀏覽器時(shí)提示
32、
時(shí)間腳本收集
33、
一組常用的彈出窗口用法
34、
通過寬帶路由器搭建WEB/FTP服務(wù)器
35、
js sort 擴(kuò)展
36、
HTML 中 SELECT 選項(xiàng)分組
37、
字符,字節(jié)和編碼
38、
Hibernate復(fù)合主鍵BUG
39、
開始→運(yùn)行→輸入的命令集錦
40、
結(jié)合spring+hibernate與jdbc的事務(wù)
41、
動(dòng)物笑話 III
42、
Windows下用subversion進(jìn)行版本控制(ZZ)
43、
解決WinXP網(wǎng)絡(luò)不能互相訪問
44、
進(jìn)展&安排
45、
svn 服務(wù)簡單搭建
46、
我的手冊
47、
在網(wǎng)上發(fā)現(xiàn)好文一篇,與大家共享,哈哈~
48、
如何成為一個(gè)早起者!!
49、
迎接RIA時(shí)代的來臨
50、
【轉(zhuǎn)】怎樣成為優(yōu)秀的軟件模型設(shè)計(jì)者
51、
myeclipse中對(duì)包的使用
52、
個(gè)性化頁面布局的設(shè)計(jì)思考與Rails初步實(shí)現(xiàn)
53、
人成熟的4個(gè)標(biāo)志
54、
ActionServlet類
55、
Json-lib 2.1發(fā)布
56、
初試Filter對(duì)權(quán)限和session的控制。
57、
Mysql5 交叉表查詢
58、
做個(gè)游戲:如果每天能有30分鐘空閑時(shí)間的話
59、
整理近幾天處理JSP頁面中遇到的幾個(gè)問題
60、
java 文件加載 (參考 Hibernate 源碼 )
61、
質(zhì)量和快速?zèng)Q定了軟件架構(gòu)
62、
lilya一個(gè)基于extjs的jsf組件編程模型......
63、
教大家實(shí)現(xiàn)序列化的克隆
64、
Java 的一些小細(xì)節(jié),你知道嗎?(《Java就業(yè)培訓(xùn)教程》讀書筆記)
65、
JAVA程序員不可不注意的編碼規(guī)范
66、
使用For遍歷Map
67、
學(xué)習(xí)java必看--習(xí)慣,心理篇
68、
轉(zhuǎn):Java同步機(jī)制淺談――synchronized對(duì)代碼作何影響?
69、
Hibernate 核心接口
70、
一些優(yōu)秀的自己卻沒用的小開源項(xiàng)目,
71、
Calendar的使用(簡單)
72、
Ghost 指南
posted @
2007-10-11 15:07 CoderDream 閱讀(204) |
評(píng)論 (0) |
編輯 收藏
點(diǎn)擊超鏈接調(diào)用JavaScript函數(shù),一般人都用<a href="javascript:function();">
但這有個(gè)缺點(diǎn),就是點(diǎn)擊鏈接后,頁面上的GIF動(dòng)畫將靜止。
試看如下代碼:
<script language="javascript">
<!--
function Foo()
{
//do something
}
//-->
</script>
<img src="http://****/logo.gif">
<a href="javascript:Foo();">使GIF動(dòng)畫靜止的鏈接</a>
解決方法探討:
<a
onclick="javascript:Foo();">鏈接</a>
此時(shí)不影響動(dòng)畫顯示,但鼠標(biāo)移上去后,鼠標(biāo)及超鏈接樣式不發(fā)生變化,雖然可以利用樣式表來改變鼠標(biāo)及超鏈接樣式,但畢竟有些繁瑣,況且這種思路也不好。
再考查如下代碼:
<a onclick="javascript:Foo();" href="#">鏈接</a>
我們可以發(fā)現(xiàn),雖然點(diǎn)擊鏈接后不影響動(dòng)畫顯示,但頁面總是滾到最上面,這種效果也不是我們想要的。
最終解決方法:
<a onclick="javascript:Foo(); return false;" href="#">不影響GIF的鏈接</a>
由于點(diǎn)接鏈接后,先觸發(fā)onclick,再執(zhí)行href屬性對(duì)應(yīng)的值,在onclick中加上return false;中斷了執(zhí)行,所以頁面就不會(huì)跳到最上部了。
posted @
2007-10-11 10:11 CoderDream 閱讀(4456) |
評(píng)論 (2) |
編輯 收藏
01、
為我學(xué)習(xí) Spring AOP 準(zhǔn)備(Proxy)
02、
滿江紅的中文技術(shù)文檔
03、
Tomcat 5/6 GBK 編碼下完美解決中文表單問題的過濾器
04、
HttpURLConnection使用中遇到的一個(gè)問題
05、
jsf1.2 自定義日歷組件
06、
Eclipse中安裝Maven
07、
利用XmlBean輕松讀寫xml(轉(zhuǎn))
08、
通用權(quán)限管理系統(tǒng)設(shè)計(jì)篇(三)——概要設(shè)計(jì)說明書
09、
讓OSGi支持JSF Web開發(fā)
10、
第一次與獵頭“親密接觸”
11、
javax.mail使用例子
12、
英語口語可以這樣練成
13、
讓 java 動(dòng)態(tài)
14、
教大家學(xué)習(xí)多線程 和對(duì)象流
posted @
2007-10-10 17:20 CoderDream 閱讀(156) |
評(píng)論 (0) |
編輯 收藏
4、CSS濾鏡
4.1、Alpha屬性--設(shè)置透明層次
4.2、Blur 濾鏡--模糊效果
4.3、FlipH、FlipV 濾鏡--水平垂直翻轉(zhuǎn)
4.4、Gray濾鏡--灰度
4.5、Invert濾鏡--反轉(zhuǎn)
4.6、Xray濾鏡--X射線
4.7、Wave濾鏡--波紋
使用濾鏡屬性可以把可視化的濾鏡和轉(zhuǎn)場效果添加到一個(gè)標(biāo)準(zhǔn)的 HTML 元素中,例如圖片、文本,以及其他一些對(duì)象。對(duì)于濾鏡和漸變效果,前者是基礎(chǔ),后者是濾鏡效果的不斷變化和演示更替。 下面介紹幾種常用的濾鏡:
1、Alpha 濾鏡-- 設(shè)置透明層次
基本語法
{
filter: alpha (
opacity = opacity,
finishopacity = finishopacity,
style = style,
startx = startx,
starty = starty,
finishx = finishx,
finishy = finishy
)
}
語法解釋
Alpha 屬性是把一個(gè)目標(biāo)元素與背景混合,設(shè)計(jì)者可以指定數(shù)值來控制混合的程度。這種“與背景混合”通俗地說就是一個(gè)元素的透明度。通過指定坐標(biāo),可以指定點(diǎn)、線、面的透明度。它們的含義分別如下:
“opacity”:代表透明度水準(zhǔn)。范圍是從0~100,他們其實(shí)是百分比的形式。也就是說,0代表完全透明,100代表完全不透明。
“finishopacity”:是一個(gè)可選參數(shù),如果想要設(shè)置漸變的透明效果,就可以使用他們來指定結(jié)束時(shí)的透明度。范圍也是0 到 100。
“style”:指定了透明區(qū)域的形狀特征。其中0代表統(tǒng)一形狀、1代表線形、2代表放射狀、3代表長方形。
“StartX”和“StartY”:代表漸變透明效果的開始X和Y坐標(biāo)。
“FinishX”和“FinishY”:代表漸變透明效果結(jié)束X和Y 的坐標(biāo)。
文件范例:13-23.htm
{
filter: alpha (
opacity = opacity,
finishopacity = finishopacity,
style = style,
startx = startx,
starty = starty,
finishx = finishx,
finishy = finishy
)
}
文件說明:
設(shè)定 Alpha 濾鏡為半透明
顯示結(jié)果:

下面的三種效果除“Style”參數(shù)不同外(分別為1、2、3),其它參數(shù)均相同。圖1的代碼是: Alpha(Opacity=10, FinishOpacity=90, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=100);
2、Blur 濾鏡-- 模糊效果
基本語法
{ filter:blur (
add = add,
direction = direction,
strength = strength
)
}
語法解釋
add 參數(shù)是一個(gè)布爾判斷:true (默認(rèn))或false ,它指定圖片是否被改變成印象派的模糊效果。
模糊效果是按順時(shí)針方向進(jìn)行的,derection 參數(shù)用來設(shè)置模糊的方向。其中0°表示垂直向上,然后每45°為一個(gè)單位,默認(rèn)值是向左的270°。
strength 值只能使用整數(shù)來指定,它代表有多少像素的寬度將受到模糊影響,默認(rèn)是 5 像素。
文件范例:13-24.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-24.htm -->
<!-- 文件說明:CSS中的Blur濾鏡 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS中的Blur濾鏡</TITLE>
<Style Type="text/css">
<!--
img{
FILTER:BLUR(STRENGTH=10);
}
-->
</Style>
</HEAD>
<BODY>
<H2>強(qiáng)大的CSS濾鏡</H2>
<IMG Src=13-23.jpg>
</BODY>
</HTML>
文件說明:
設(shè)定了 blur 濾鏡的模糊強(qiáng)度為 10。
顯示結(jié)果:

3、FlipH、FlipV 濾鏡-- 水平垂直翻轉(zhuǎn)
基本語法
{ filter:filph }
{ filter:filpv }
語法解釋
上述兩句代碼分別 表示水平翻轉(zhuǎn)和垂直翻轉(zhuǎn)
文件范例:13-25.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-25.htm -->
<!-- 文件說明:CSS中的FlipV濾鏡 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS中的FlipV濾鏡</TITLE>
<Style Type="text/css">
<!--
img{
FILTER:FlipV;
}
-->
</Style>
</HEAD>
<BODY>
<H2>強(qiáng)大的CSS濾鏡</H2>
<IMG Src=13-23.jpg>
</BODY>
</HTML>
文件說明:
設(shè)定垂直翻轉(zhuǎn)濾鏡
顯示結(jié)果:

4、Gray 濾鏡 -- 灰度
基本語法
{ filter:gray }
語法解釋
Gray 濾鏡的作用是把一張圖片變成灰度圖。
文件范例:13-26.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-26.htm -->
<!-- 文件說明:CSS中的Gray濾鏡 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS中的Gray濾鏡</TITLE>
<Style Type="text/css">
<!--
img{
FILTER:gray;
}
-->
</Style>
</HEAD>
<BODY>
<H2>強(qiáng)大的CSS濾鏡</H2>
<IMG Src=13-23.jpg>
</BODY>
</HTML>
顯示結(jié)果:

5、Invert 濾鏡 -- 反轉(zhuǎn)
基本語法
{ filter:invert }
語法解釋
Invert 濾鏡的作用是把對(duì)象的可視化屬性全部翻轉(zhuǎn),包括色彩、飽和度和亮度值。
文件范例:13-27.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-27.htm -->
<!-- 文件說明:CSS中的Invert濾鏡 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS中的Invert濾鏡</TITLE>
<Style Type="text/css">
<!--
img{
FILTER:invert;
}
-->
</Style>
</HEAD>
<BODY>
<H2>強(qiáng)大的CSS濾鏡</H2>
<IMG Src=13-23.jpg>
</BODY>
</HTML>
顯示結(jié)果:

6、Xray 濾鏡 -- X 射線
基本語法
{ filter:xray }
語法解釋
Xray 濾鏡的作用是讓對(duì)象反映出它的輪廓并把這些輪廓加亮,也就是所謂的“X”光片。
文件范例:13-28.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-28.htm -->
<!-- 文件說明:CSS中的Xray濾鏡 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS中的Xray濾鏡</TITLE>
<Style Type="text/css">
<!--
img{
FILTER:xray;
}
-->
</Style>
</HEAD>
<BODY>
<H2>強(qiáng)大的CSS濾鏡</H2>
<IMG Src=13-23.jpg>
</BODY>
</HTML>
顯示結(jié)果:

7、Wave 濾鏡 -- 波紋
基本語法
{
filter:wave (
add = add,
freq = freq,
lightstrength = strength,
phase = phase,
strength = strength
)
}
語法解釋
Wave
Add參數(shù)有兩個(gè)參數(shù)值:True代表把對(duì)象按照波紋樣式打亂;False代表不打亂;
Freq參數(shù)指生成波紋的頻率,也就是指定在對(duì)象上共需要產(chǎn)生多少個(gè)完整的波紋。
LightStrength參數(shù)是為了使生成的波紋增強(qiáng)光的效果。參數(shù)值可以從0到100。
Phase參數(shù)用來設(shè)置正弦波開始的偏移量。這個(gè)值的通用值為0,它的可變范圍為從0到100。這個(gè)值代表開始時(shí)的偏移量占波長的百分比。比如該值為25,代表正弦波從90度(360*25%)的方向開始。
STRENGTH 振幅大小
文件范例:13-29.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-29.htm -->
<!-- 文件說明:CSS中的Wave濾鏡 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS中的Wave濾鏡</TITLE>
<Style Type="text/css">
<!--
img{
FILTER:wave(add=add,freq=2,lightstrength=50,phase=45,strength=10);
}
-->
</Style>
</HEAD>
<BODY>
<H2>強(qiáng)大的CSS濾鏡</H2>
<IMG Src=13-23.jpg>
</BODY>
</HTML>
顯示結(jié)果:

posted @
2007-10-09 17:59 CoderDream 閱讀(489) |
評(píng)論 (1) |
編輯 收藏
在再保系統(tǒng)中,我們有時(shí)候會(huì)以某個(gè)日期作為查詢條件,如在“參數(shù)維護(hù)”的某個(gè)模塊中,需要將“生效日期”作為查詢條件。
我們在JSP中使用JS插件輸入“yyyy-mm-dd”格式的日期,但是數(shù)據(jù)庫(DB2)中的字段是“TimeStamp”,而我們在DBean中用VO接這個(gè)字段是用“Date”類型,這樣在做查詢的Dao類的方法中,我們要對(duì)這個(gè)字段進(jìn)行處理。
首先定義一種格式變量:
SimpleDateFormat myFmt = new SimpleDateFormat("yyyy-MM-dd");
然后將Date類型的變量進(jìn)行格式化:
myFmt.format(reCededRateVO.getBoundDate())
這樣會(huì)得到“yyyy-MM-dd”格式的日期,然后就可以放到Sql語句中作為條件進(jìn)行查詢了。
/**
* description: 根據(jù)公司別、再保類別查詢與之相符合的紀(jì)錄
*
* @param reCededRateVO
* ReCededRateVO
* @param startRow
* 起始行
* @param numberOfRows
* 讀取行數(shù)
* @return List 結(jié)果集
* @throws DbAccessException
* 數(shù)據(jù)庫訪問異常
*/
public List selectListByCode(ReCededRateVO reCededRateVO,
int startRow, int numberOfRows) throws DbAccessException {
if (DEBUGLOG.isDebugEnabled()) {
DEBUGLOG.debug("[ReCededRateDataDao.selectListByCode()]"
+ "[begin]");
}
SimpleDateFormat myFmt = new SimpleDateFormat("yyyy-MM-dd");
StringBuffer hqlBuff = new StringBuffer(
"from ReCededRateData as t where 1=1");
// 公司別
if (!"".equals(reCededRateVO.getCompanyFlag())
&& reCededRateVO.getCompanyFlag() != null) {
hqlBuff.append(" and t.id.companyFlag = '"
+ reCededRateVO.getCompanyFlag() + "'");
}
// 再保類別
if (!"".equals(reCededRateVO.getReinsuranceClass())
&& reCededRateVO.getReinsuranceClass() != null) {
hqlBuff.append(" and t.id.reinsuranceClass = '"
+ reCededRateVO.getReinsuranceClass() + "'");
}
// 再保層次
if (!"".equals(reCededRateVO.getReinsuranceLevel())
&& reCededRateVO.getReinsuranceLevel() != null) {
hqlBuff.append(" and t.id.reinsuranceLevel = '"
+ reCededRateVO.getReinsuranceLevel() + "'");
}
// 生效日期
if (!"".equals(reCededRateVO.getBoundDate())
&& reCededRateVO.getBoundDate() != null) {
hqlBuff.append(" and t.endDate >= '"
+ myFmt.format(reCededRateVO.getBoundDate())
+ "' and t.id.boundDate <= '"
+ myFmt.format(reCededRateVO.getBoundDate()) + "'");
}
hqlBuff.append(" order by t.id.companyFlag asc, t.id.boundDate asc,"
+ "t.id.reinsuranceClass asc, t.id.reinsuranceLevel asc,"
+ "t.id.reCompanyCode asc, t.id.bodyFlag asc");
// 以公司別+生效日期+再保類別排序+再保層次+再保公司+體位別");
List list = this.hQueryByPage(hqlBuff.toString(), startRow,
numberOfRows);
if (list != null && list.size() > 0) {
if (DEBUGLOG.isDebugEnabled()) {
DEBUGLOG.debug("[selectListByCode()]select list success![end]");
}
return list;
} else {
if (DEBUGLOG.isDebugEnabled()) {
DEBUGLOG.debug("[selectListByCode()]select list return null!"
+ "[end]");
}
return null;
}
}
posted @
2007-10-09 15:41 CoderDream 閱讀(721) |
評(píng)論 (0) |
編輯 收藏
<html>
<head>
<script language="javascript">
var rowIndex = 0;
function addOneLineOnClick() {
var row = tb.insertRow(tb.rows.length);
col = row.insertCell(0);
col.innerHTML = "<tr><input size='90' name=btn index=\""+ rowIndex +"\" >";
col = row.insertCell(1);
col.innerHTML = "<input type='button' value='Del' onclick=\"return DeleteRow('row" + rowIndex +"')\"></tr>";
row.setAttribute("id", "row" + rowIndex);
row.setAttribute("name", "row" + rowIndex);
rowIndex++;
}
function DeleteRow(rowTag){
var i = tb.rows(rowTag).rowIndex;
var j;
for(j=i;j<=rowIndex;j++) {
tb.rows(j).cells(0).all("btn").index--;
}
tb.deleteRow(i);
rowIndex--;
}
</script>
</head>
<body >
<div align="center">
<table width="95%" name="tb" id="tb">
<tr>
</tr>
</table>
<p>
<input name="btnAddLine" type="button" id="btnAddLine" onClick="return addOneLineOnClick()" value="Add">
</div>
</body>
</html>
posted @
2007-10-09 10:14 CoderDream 閱讀(338) |
評(píng)論 (0) |
編輯 收藏
3.4、邊框?qū)傩?/a>
3.5、鼠標(biāo)光標(biāo)屬性
3.6、定位屬性
3.7、區(qū)塊屬性
3.8、列表屬性
3.3.4、邊框?qū)傩?a id="030304" name="030304">
不同方向的邊框?qū)傩匀绫硭荆?br />
邊框?qū)傩?/th>
| 描述 |
border |
邊框 |
border-top |
上邊框 |
border-left |
左邊框 |
border-right |
右邊框 |
border-bottom |
下邊框 |
對(duì)于邊框的樣式,可以按照下表中所示進(jìn)行設(shè)置:
邊框樣式屬性值 |
描述 |
none |
無邊框 |
dotted |
邊框由點(diǎn)組成 |
dash |
邊框由短線組成 |
solid |
邊框是實(shí)線 |
double |
邊框是雙實(shí)線 |
groove |
邊框帶有立體感的溝槽 |
ridge |
邊框成脊型 |
inset |
邊框內(nèi)嵌一個(gè)立體邊框 |
outset |
邊框外嵌一個(gè)立體邊框 |
范例文件:13-18.htm
1 <!-- ------------------------------ -->
2 <!-- 文件范例:13-18.htm -->
3 <!-- 文件說明:CSS邊框 -->
4 <!-- ------------------------------ -->
5 <HTML>
6 <HEAD>
7 <TITLE>CSS背景圖像位置</TITLE>
8 <Style Type="text/css">
9 <!--
10 P{
11 border-top: 2px solid #990000;
12 border-right: 2px solid #3399FF;
13 border-bottom: 2px solid #00FF33;
14 border-left: 2px solid #CC33FF;
15 }
16 -->
17 </Style>
18 </HEAD>
19 <BODY>
20 <H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
21 <p>目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</P>
22 </BODY>
23 </HTML>
文件說明:
第10~15行分別設(shè)定了上、右、下、左4個(gè)邊框的寬度、邊框樣式和顏色。
顯示結(jié)果:

3.4.5、鼠標(biāo)光標(biāo)屬性
鼠標(biāo)光標(biāo)屬性值 |
描述 |
hand |
手 |
crosshair |
交叉十字 |
text |
文本選擇符號(hào) |
wait |
Windows 的沙漏形狀 |
default |
默認(rèn)的鼠標(biāo)形狀 |
help |
帶問號(hào)的鼠標(biāo) |
e-resize |
向東的箭頭 |
ne-resize |
指向東北方的箭頭 |
n-resize |
向北的箭頭 |
nw-resize |
指向西北方的箭頭 |
w-resize |
向西的箭頭 |
sw-resize |
指向西南方的箭頭 |
s-resize |
向南的箭頭 |
se-resize |
指向東南方的箭頭 |
范例文件:13-19.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-19.htm -->
<!-- 文件說明:CSS鼠標(biāo)光標(biāo)屬性 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS鼠標(biāo)光標(biāo)屬性</TITLE>
<Style Type="text/css">
<!--
Body{
CURSOR:CROSSHAIR
}
IMG{
Cursor:help
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<img src=13-19.jpg align=left>
<P>目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</P>
</BODY>
</HTML>
顯示結(jié)果:


3.4.6、定位屬性
定位屬性 |
描述 |
position |
“absolute”(絕對(duì)定位)、“relative”(相對(duì)定位) |
top |
層距離頂點(diǎn)縱坐標(biāo)的距離 |
left |
層距離頂點(diǎn)橫坐標(biāo)的距離 |
width |
層的寬度 |
height |
層的高度 |
z-index |
決定層的先后順序和覆蓋關(guān)系,值高的元素會(huì)覆蓋值比較低的元素 |
clip |
限定只顯示裁切出來的區(qū)域,裁切出的區(qū)域?yàn)榫匦巍V灰O(shè)定兩個(gè)點(diǎn)即可,一個(gè)是矩形左上角的頂點(diǎn),由top和right兩項(xiàng)的設(shè)置完成,另一個(gè)是右下角的頂點(diǎn),由bottom和 right 兩項(xiàng)設(shè)置完成 |
overflow |
當(dāng)層內(nèi)的內(nèi)容超出層所能容納的范圍時(shí):
visible:層的大小、內(nèi)容都會(huì)顯示出來
hidden:會(huì)隱藏超出層大小的內(nèi)容
scrol:不管內(nèi)容是否超出層的范圍,選中此項(xiàng)都會(huì)為層添加滾動(dòng)條
auto:只在內(nèi)容超出層的范圍時(shí)才顯示滾動(dòng)條
|
visibility |
這一項(xiàng)是針對(duì)嵌套層的設(shè)置,嵌套層是插入在其他層中的層,分為嵌套的層(子層)和被嵌套的層(父層)
inherit:子層繼承父層的可見性,父層可見,子層也可見;父層不可見,子層也不可見
visible:無論父層可見與否,子層都可見
hidden:無論父層可見與否,子層都隱藏
|
范例文件:13-20.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-20.htm -->
<!-- 文件說明:CSS定位屬性 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS定位屬性</TITLE>
<Style Type="text/css">
<!--
.self{
position:absolute;
top:80px;
left:50px;
width:300px;
height:100px;
overflow:auto;
background-color:#336699;
color:#FFFFFF;
z-index:1;
visibility:visible;
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<div class="self">目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</div>
</BODY>
</HTML>
顯示結(jié)果:

3.4.7、區(qū)塊屬性
區(qū)塊屬性 |
描述 |
width |
設(shè)定對(duì)象的寬度 |
height |
設(shè)定對(duì)象的高度 |
float |
讓文字環(huán)繞在一個(gè)元素的四周 |
clear |
指定在某一個(gè)元素的某一邊是否允許有環(huán)繞的文字或?qū)ο?/td>
|
padding |
決定了究竟在邊框與內(nèi)容之間應(yīng)該插入多少空間距離,它有4個(gè)屬性,分別是:top、bottom、left、right,分別用于設(shè)定上下左右的填充距離 |
margin |
設(shè)置一個(gè)元素在4個(gè)方向上與瀏覽器窗口邊界或上一級(jí)元素的邊界的距離。與“padding”類似,它也有上下左右4個(gè)屬性,分別控制4個(gè)方向 |
范例文件:13-21.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-21.htm -->
<!-- 文件說明:CSS區(qū)塊屬性 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS區(qū)塊屬性</TITLE>
<Style Type="text/css">
<!--
.self{
width:300px;
height:100px;
MARGIN-TOP: 20PX;
MARGIN-RIGHT: 30PX;
MARGIN-BOTTOM: 20PX;
MARGIN-LEFT: 30PX
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<div class=self>目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</div>
</BODY>
</HTML>
顯示結(jié)果:

3.4.8、列表屬性
列表屬性 |
描述 |
list-style-type |
設(shè)定引導(dǎo)列表選項(xiàng)的符號(hào)類型 |
bullet |
選擇圖像作為項(xiàng)目的引導(dǎo)符號(hào) |
position |
決定列表項(xiàng)目縮進(jìn)的程度,outside:列表貼近左側(cè)邊框;inside:列表縮進(jìn) |
列表符號(hào)類型屬性值 |
描述 |
disc |
在文本行前面加“●”實(shí)心園 |
circle |
在文本行前面加“○”空心園 |
square |
在文本行前面加“■”實(shí)心方塊 |
decimal |
在文本行前面加普通的阿拉伯?dāng)?shù)字 |
lower-roman |
在文本行前面加小寫羅馬數(shù)字 |
upper-roman |
在文本行前面加大寫羅馬數(shù)字 |
lower-alpha |
在文本行前面加小寫英文字母 |
upper-alpha |
在文本行前面加大寫英文字母 |
none |
不顯示任何項(xiàng)目符號(hào)或編號(hào) |
范例文件:13-22.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-22.htm -->
<!-- 文件說明:CSS列表屬性 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS列表屬性</TITLE>
<Style Type="text/css">
<!--
li{
list-style-type:upper-roman;
}
-->
</Style>
</HEAD>
<BODY>
<H2>圖像設(shè)計(jì)軟件</H2>
<OL>
<LI>Photoshop</LI>
<LI>Illustrator</LI>
<LI>Freehand</LI>
<LI>CorelDraw</LI>
</OL>
</BODY>
</HTML>
顯示結(jié)果:
posted @
2007-10-08 17:18 CoderDream 閱讀(4210) |
評(píng)論 (2) |
編輯 收藏
3.3、顏色和背景屬性
3.3.1、顏色
3.3.2、背景顏色
3.3.3、背景圖像
3.3.4、背景圖像重復(fù)
3.3.5、背景圖像位置
文本屬性 |
描述 |
color |
定義顏色 |
background-color |
設(shè)定一個(gè)元素的背景顏色 |
background-image |
設(shè)定一個(gè)元素的背景圖像 |
background-repeat |
決定一個(gè)指定的背景圖像如何被重復(fù) |
background-position |
設(shè)置水平和垂直方向上的位置 |
3.2.1、 顏色
顏色 color 屬性允許網(wǎng)頁制作者指定一個(gè)元素的顏色,一般用RGB,#FFFFFF(16進(jìn)制數(shù))表示。
文件范例:13-13.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-13.htm -->
<!-- 文件說明:CSS顏色 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS顏色</TITLE>
<Style Type="text/css">
<!--
H1 {
color:#336699
}
.text {
color:#ffcc00
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<p class=text>目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</P>
</BODY>
</HTML>
顯示結(jié)果:
3.2.2、背景顏色
文件范例:13-14.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-14.htm -->
<!-- 文件說明:CSS背景顏色 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS背景顏色</TITLE>
<Style Type="text/css">
<!--
body {
background-color:#336699
}
H1 {
background-color:#ffffff
}
.text {
background-color:#ffcc00
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<p class="text">目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</P>
</BODY>
</HTML>
顯示結(jié)果:
3.2.3、背景圖像
文件范例:13-15.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-15.htm -->
<!-- 文件說明:CSS背景圖像 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS背景圖像</TITLE>
<Style Type="text/css">
<!--
body {
Background-image:url(13-15.gif)
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<p class=text>目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</P>
</BODY>
</HTML>
顯示結(jié)果:
3.2.4、背景圖像重復(fù)
背景圖像重復(fù)屬性值 |
描述 |
repeat-x |
圖像橫向重復(fù) |
repeat-y |
圖像縱向重復(fù) |
repeat |
圖像橫向縱向重復(fù) |
no-repeat |
圖像不重復(fù)(只顯示一張圖,無任何方向的平鋪) |
文件范例:13-16.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-16.htm -->
<!-- 文件說明:CSS背景圖像重復(fù) -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS背景圖像重復(fù)</TITLE>
<Style Type="text/css">
<!--
body {
Background-image:url(13-15.gif);
background-repeat: repeat-y
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<p class="text">目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</P>
</BODY>
</HTML>
顯示結(jié)果:
3.2.5、背景圖像位置
背景圖像位置屬性值 |
描述 |
left |
背景圖像居左 |
right |
背景圖像居右 |
center |
背景圖像水平居中,垂直居中 |
top |
背景圖像上對(duì)齊 |
bottom |
背景圖像下對(duì)齊 |
與 background-repeat 屬性結(jié)合使用,否則沒有任何效果,因?yàn)?nbsp;background-repeat 的默認(rèn)屬性為repeat。
文件范例:13-17.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-17.htm -->
<!-- 文件說明:CSS背景圖像位置 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS背景圖像位置</TITLE>
<Style Type="text/css">
<!--
body {
Background-image:url(13-15.gif);
background-repeat:repeat-y;
Background-position:right top
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<p class=text>目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</P>
</BODY>
</HTML>
顯示結(jié)果:
posted @
2007-10-08 14:40 CoderDream 閱讀(6566) |
評(píng)論 (0) |
編輯 收藏
3.2、文本屬性
3.2.1、字母間隔
3.2.2、文字修飾
3.2.3、文字排列
3.2.4、文本縮進(jìn)
3.2.5、行間距
文本屬性 |
描述 |
letter-spacing |
定義一個(gè)附加在字符之間的間隔數(shù)量 |
text-decoration |
文本修飾屬性允許通過五個(gè)屬性中的一個(gè)來修飾文本 |
text-align |
設(shè)置文本的水平對(duì)齊方式,包括左對(duì)齊、右對(duì)齊、居中、兩端對(duì)齊 |
text-indent |
文字的首行縮進(jìn) |
line-height |
行高屬性接受一個(gè)控制文本基線之間的間隔的值 |
3.2.1、 字母間隔
letter-spacing 屬性定義一個(gè)附加在字符之間的間隔數(shù)量,改值必須符合長度格式,允許使用負(fù)值。一個(gè)設(shè)為0的值會(huì)阻止文字的調(diào)整。
文件范例:13-8.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-8.htm -->
<!-- 文件說明:CSS字母間隔 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS字母間隔</TITLE>
<Style Type="text/css">
<!--
H1{
letter-spacing: -10px
}
.text {
letter-spacing: 5px
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<p class=text>目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</P>
</BODY>
</HTML>
顯示結(jié)果:
3.2.2、文字修飾
文字修飾屬性值 |
描述 |
underline |
下劃線 |
overline |
上劃線 |
line-through |
刪除線 |
blink |
閃爍,只適用 NetScape 瀏覽器 |
none |
無任何修飾 |
文件范例:13-9.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-9.htm -->
<!-- 文件說明:CSS文字修飾 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS文字修飾</TITLE>
<Style Type="text/css">
<!--
a:link {
font-family: "宋體";
text-decoration: none
}
a:visited {
font-family: "宋體";
text-decoration: none
}
a:hover{
font-family:"宋體";
text-decoration: underline
}
.text {
text-decoration: underline
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<p class="text">目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、FIireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</P>
<A href=mailto:husong@elong.com>給我來信</A>
</BODY>
</HTML>
顯示結(jié)果:
3.2.3、文本排列
文字排列屬性值 |
描述 |
left |
左對(duì)齊 |
center |
居中對(duì)齊 |
right |
右對(duì)齊 |
justify |
兩端對(duì)齊 |
文件范例:13-10.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-10.htm -->
<!-- 文件說明:CSS文本排列 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS文本排列</TITLE>
<Style Type="text/css">
<!--
H1 {
text-align:center
}
.text {
text-align:justify
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<p class=text>目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</P>
<A href=mailto:husong@elong.com>給我來信</A>
</BODY>
</HTML>
顯示結(jié)果:
3.2.4、文本縮進(jìn)
文本縮進(jìn) text-indent 屬性可以應(yīng)用于塊級(jí)元素(P,H1等),定義該元素第1行可以接受的縮進(jìn)的數(shù)量。改值必須是一個(gè)長度或一個(gè)百分比,若為百分比,則視上級(jí)元素的寬度而定。通用的文本縮進(jìn)用法是用于段縮進(jìn)。
文件范例:13-11.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-11.htm -->
<!-- 文件說明:CSS文本縮進(jìn) -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS文本縮進(jìn)</TITLE>
<Style Type="text/css">
<!--
H1 {
text-indent:100pt
}
.text {
text-indent:24pt
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<p class="text">目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</P>
<A href=mailto:husong@elong.com>給我來信</A>
</BODY>
</HTML>
顯示結(jié)果:
3.2.5、行間距
行間距 line-height 屬性可以接受一個(gè)控制文本基線之間的間隔的值。當(dāng)值為百分比數(shù)字時(shí),行高由元素字體大小的量與該數(shù)字相乘所得,百分比的值相對(duì)于元素字體的大小而定,不允許使用負(fù)值。
文件范例:13-12.htm
<!-- ------------------------------ -->
<!-- 文件范例:13-12.htm -->
<!-- 文件說明:CSS行間距 -->
<!-- ------------------------------ -->
<HTML>
<HEAD>
<TITLE>CSS行間距</TITLE>
<Style Type="text/css">
<!--
.text {
line-height:24pt
}
-->
</Style>
</HEAD>
<BODY>
<H1>主流的網(wǎng)頁設(shè)計(jì)軟件</H1>
<p class="text">目前,網(wǎng)頁技術(shù)進(jìn)入了一個(gè)新的階段,現(xiàn)在的網(wǎng)頁再也不是圖片的堆積和枯燥無味的文本了,人們現(xiàn)在追求的是網(wǎng)頁的動(dòng)態(tài)效果和交互性。而Macromedia公司的網(wǎng)頁設(shè)計(jì)三劍客軟件Dreamweaver、Flash、Fireworks正是交互性網(wǎng)頁設(shè)計(jì)的杰出代表,其最新版本MX繼承了前期版本的優(yōu)點(diǎn),進(jìn)行了功能的進(jìn)一步整合,非常適合于網(wǎng)頁設(shè)計(jì)和網(wǎng)站建設(shè)的需要。</P>
<A href=mailto:husong@elong.com>給我來信</A>
</BODY>
</HTML>
顯示結(jié)果:
posted @
2007-10-08 14:14 CoderDream 閱讀(1154) |
評(píng)論 (0) |
編輯 收藏