0000標題002      

再來,橙子來說明設定網頁文字的顏色,當然,在設定完文字的格式後我們通常要設定文字的顏色,雖說,我在設定網頁文字的時候通常只使用幾種顏色,黑色、白色、灰色,最常用的是黑色,次之是白色,最後才是灰色,因為文字的使用通常還是用黑色較為顯著,而白色通常是使用在底色為深色時使用,灰色是用於較為不重要內容,但又須說明的地方,用這三種顏色,是個人覺得此三種顏色搭配出來的網頁感覺較為高尚(個人認為啦!),但也是看網頁的配置、配色而定,如果在設計關於小朋友、遊樂園的、電玩的,也可以使用較為豐富的文字顏色,來突顯網頁的活潑性,個人較為少使用,可能也是因為之前都是在設計公司的網頁較為多吧!

我們以上次的資料來說明吧!

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>魚和橙</title>
</head>
<body>
<h1>this is my font style</h1>
<p>The results of a survey published Friday showed that 70 percent of local salaried employees are hesitant(1) about getting married, citing insufficient(2) savings and job instability as the reasons. </p>
<p> According to the survey conducted by 360d, a local job bank, the majority of the respondents said their current situations do not allow them to get married. </p>
<p> Of these, 84 percent said they do not have enough savings and salaries, while 49 percent said their jobs are unstable. Another 41 percent answered in the multiple-choice questionnaire said that they have not met the right person. </p>
<p> Meanwhile, 58 percent of those polled said they need at least NT$1 million (US$33,343.3) in savings before they will decide to walk down the aisle(3), while 92 percent said money can help strengthen their romantic relationships. </p>
<p> About 53 percent of the single respondents said they are not ready for relationships now, citing the lack of money, the extra expenses needed when in a relationship and being too busy with work as their reasons. </p>
<p>Wesley Yang, a manager at the job bank, said that in light of the weak economy, many moonlighters(4) have arranged plans to a little extra cash on Chinese Valentine's Day, which falls on the seventh day of the seventh month on the lunar calendar, or Aug. 23, this year. </p>
<p>These moonlighting jobs include delivering flowers, queuing up for restaurants or buying gifts on behalf of clients, working as housekeepers at hotels and even as professional huggers who provide hugs on the streets to single people on Valentine's Day, Yang said. </p>
<p>The survey collected 2,051 valid samples from July 31-Aug. 13. It had a margin of error of 3 percentage points and a confidence level of 95 percent. </p>
</body>
</html>

 我們來加入顏色!<p>都改成紅色的吧!加入相對應的css吧!

<style type="text/css">
p {
    color: red;
}
</style>

 我們在<p>加入color:red; 表示將 <p>全數改成紅色的,來看看結果吧!

2012-10-01_102519  

是不是全部變成了紅色了!

我們剛剛用了color:red;的方式,用red 的方式,只是其中一樣而以,我們在之前的文章有介紹過而如果要特殊的顏色,也可以使用以下兩種方式設定顏色

1、十六進位:#525252

2、RGB:rgb(55,66,88)

而我們就他們來改變<h1>的顏色吧!加入css

<style type="text/css">
p {
    color: red;
}
h1 {
    color: #00Ff55;
}
</style>

 看看結果吧!

2012-10-01_103151  

有看到標題<h1>顏色改變了吧!再來橙子再使用RGB的方式來改變<h1>吧!修改css

<style type="text/css">
p {
    color: red;
}
h1 {
    color: rgb(0,102,255);
}
</style> 

看看結果吧!

2012-10-01_103536   

可以看到<h1>的標題變成了藍色的了

由以上的方式,可以將文字的顏色改成各式各樣的顏色,不過記得一件事,文字是要給人看清楚的不要設定一種快和底色溶為一體的顏色,這樣整個網頁會看起來亂七八糟的,這樣許多人在看您的網頁時候,就會看不下去而轉台了!








 

arrow
arrow
    文章標籤
    網頁設計
    全站熱搜

    雲橙雨林 發表在 痞客邦 留言(0) 人氣()