css樣式表怎么用啊

CSS的調(diào)用，按照CSS出現(xiàn)在頁面的不同位置，可以分為3種方法：

成都創(chuàng)新互聯(lián)"三網(wǎng)合一"的企業(yè)建站思路。企業(yè)可建設(shè)擁有電腦版、微信版、手機(jī)版的企業(yè)網(wǎng)站。實(shí)現(xiàn)跨屏營銷，產(chǎn)品發(fā)布一步更新，電腦網(wǎng)絡(luò)+移動(dòng)網(wǎng)絡(luò)一網(wǎng)打盡，滿足企業(yè)的營銷需求！成都創(chuàng)新互聯(lián)具備承接各種類型的成都做網(wǎng)站、網(wǎng)站設(shè)計(jì)項(xiàng)目的能力。經(jīng)過10年的努力的開拓，為不同行業(yè)的企事業(yè)單位提供了優(yōu)質(zhì)的服務(wù)，并獲得了客戶的一致好評。

元素中直接使用；

從頁面頭部調(diào)用；

采用鏈接的形式調(diào)用。

不同的調(diào)用方法有不同的寫法和優(yōu)先級。下面分別做一下介紹。

一、元素中直接使用

這種調(diào)用方式的寫法如下：

元素名稱 style="屬性:屬性值;"/元素名稱

在樣式中直接使用CSS，語法是使用style標(biāo)簽，在雙引號中，樣式的語法結(jié)構(gòu)和獨(dú)立樣式表中完全相同。例如：

div style="width:240px;height:80px;background-color:#cccccc;text-align:center;font-size:14px"

示例：元素中直接調(diào)用。/div

該樣式中定義了元素寬、高為360、80像素，背景色為灰色，字體大小為14像素。其應(yīng)用到頁面中的顯示如圖1。

二、從頁面頭部調(diào)用

從頁面頭部調(diào)用CSS是將CSS寫在頁面的head元素中，然后在頁面中調(diào)用。其語法結(jié)構(gòu)如下：

style

選擇符{屬性:屬性值;}

/style

頁面上的所有樣式都可以寫在style和/style中。使用這種方式調(diào)用CSS，在頁面中必須有相應(yīng)的調(diào)用代碼。

其中，類選擇符的調(diào)用代碼如下：

元素名稱 class="類選擇符名稱"/元素名稱

ID選擇符的調(diào)用代碼如下：

元素名稱 id="id 類選擇符名稱"/元素名稱

下面我們來用一個(gè)示例演示一下。

head

titleCSS調(diào)用方法/title

style

.content{

background-color: #cccccc;

font-size: 14px;

width: 240px;

height: 80px;

color: Blue;

text-align: center;

}

/style

/head

body

div class="content"示例：從頁面頭部調(diào)用。/div

/body

該樣式應(yīng)用到頁面的效果如圖2所示。

三、采用鏈接的形式調(diào)用

采用鏈接的形式調(diào)用CSS通常有兩種方法：

使用link元素

使用link元素調(diào)用CSS的語法如下：

link rel="stylesheet" href="css文件路徑" type="text/css"/

其中rel="stylesheet"指這個(gè)link和其href之間的關(guān)聯(lián)樣式為樣式表文件。type="text/css"指文件類型是樣式表文本。

使用@import

使用@import調(diào)用和使用link元素調(diào)用的區(qū)別在于，使用@import的調(diào)用方法只能使用在樣式文件中，即只能在調(diào)用的樣式文件，或style元素中才能正常使用

如何自定義WordPress的登錄頁面

一、將下面代碼加到主題functions.php模版文件的最后。

?php

function?custom_login()?{

echo?'link?rel="stylesheet"?tyssspe="text/css"?href="'?.?get_bloginfo('template_directory')?.?'/custom_login/custom_login.css"?/';?}

add_action('login_head',?'custom_login');

?

二、在所用主題中新建一個(gè)名稱為：custom_login?的文件夾，并在其中新建：custom_login.css及制作好的網(wǎng)站LOGO： logo.png也放進(jìn)去。

三、將下面代碼添加到custom_login.css中。

/**?背景及字體?**/?

html,body.login{

background:#f2f2f2;

font:?14px?'Microsoft?YaHei',?Arial,?Lucida?Grande,?Tahoma,?sans-serif;

}

/**?去掉鏈接下劃線?**/?

html?a{

text-decoration:?none;

}

/**?登錄DIV?**/?

#login?{

background:#fff;

border:?1px?solid?#ccc;

width:400px;

margin:?40px?auto?0;

padding:?10px?10px?20px?10px;

border-radius:5px;

box-shadow:0?4px?10px?-1px?rgba(200,?200,?200,?0.7);

}

/**?替換logo?**/?

.login?h1?a{

background:?#fff?url(logo.png)?no-repeat?center;

width:400px;

}

/**?提示?**/?

.updated,?.login?.message?{

background:#fff;

border:?none;

text-align:?center;

}

/**?表單?**/?

.login?form?{

box-shadow:none;

border:?none;

}

#loginform,?#registerform,?#lostpasswordform{

background:transparent;

border:none;

}

/**?按鈕?**/?

.button-primary,.submit?.button-primary,#login?form?.submit?input?{

width:83px;

height:25px;

font-weight:?bold;

border:none;

}

上面只羅列了登錄界面幾個(gè)基本要素的樣式修改。可以使用火狐擴(kuò)展Firebug查看各部分DIV選擇器名稱進(jìn)行詳細(xì)修改。最終效果如圖：

同時(shí)還可參考登錄頁面默認(rèn)樣式文件：wordpress\wp-admin\css目錄的wp-admin.min.css，進(jìn)一步個(gè)性化登錄頁面，就看自己的創(chuàng)意了！另外，也可以將下面代碼添加到主題functions.php模版文件中，直接將樣式寫在其中。

function?new_custom_login_logo()?{

echo?'style?type="text/css"

//YOUR?CSS?Code?Here

/style';

}

注：HotNews主題早期版本集成了該功能，后來添加前臺(tái)登錄功能后就將其刪除了。

求一個(gè)JSP界面的CSS登陸樣式

style type="text/css"

body{ background:#fff;padding:0; margin:0;font-size:12px;}

img{ border:0; padding:0; margin:0;}

ul{list-style:none;}

.login_bg{ background:url(%=path%financemanage/images/login_new/login_bg.gif) repeat-x; height:591px;}

.dl_bg{ background:url(%=path%financemanage/images/login_new/dlbg.jpg) no-repeat center top;}

.diwen{ background:url(%=path%financemanage/images/login_new/diwen.gif) repeat-x;}

.usename{ font-size:14px; color:#0e3c00;}

.dl_text{ width:145px; height:17px; background:url(%=path%financemanage/images/login_new/text.gif) repeat-x center; border:1px solid #1c5302;}

.dl_but{ width:75px; height:50px; background:url(%=path%financemanage/images/login_new/dlbut.gif) no-repeat; border:0 none; cursor:pointer;}

/style

script language="javascript" type="text/javascript"

var count = 0;

function submit_onclick(obj){

if (count == 0) {

//alert("MAC:" + document.forms[0].MACAddr.value);

obj.submit();

count ++;

}

}

function submit2() {

if (count != 0) {

return false;

}

if (event.keyCode==13) {

document.forms[0].submit();

}

}

/script

!-- script FOR="foo" EVENT="OnObjectReady(objObject,objAsyncContext)" LANGUAGE="JScript"

if(objObject.IPEnabled != null objObject.IPEnabled != "undefined" objObject.IPEnabled == true)

{

if(objObject.MACAddress != null objObject.MACAddress != "undefined")

MACAddr = objObject.MACAddress;

if(objObject.IPEnabled objObject.IPAddress(0) != null objObject.IPAddress(0) != "undefined")

IPAddr = objObject.IPAddress(0);

}

/script

object classid="CLSID:76A64158-CB41-11D1-8B02-00600806D9B6" id="locator" VIEWASTEXT /object

object classid="CLSID:75718C9A-F029-11d1-A1AC-00C04FB6C223" id="foo" /object

script LANGUAGE="JScript"

var service = locator.ConnectServer();

var MACAddr ;

var IPAddr ;

service.Security_.ImpersonationLevel=3;

service.InstancesOfAsync(foo, 'Win32_NetworkAdapterConfiguration');

/script

--

/head

body onKeyPress="submit2();"

table width="100%" border="0" cellspacing="0" cellpadding="0" class="login_bg"

tr

td height="135" align="center" valign="top"img src="%=request.getContextPath()%/financemanage/images/login_new/logo.jpg" width="939" height="135" //td

/tr

tr

td height="391" align="center" valign="top" class="dl_bg"

html:form action="/financemanage/login.do" method="post"

table width="320" height="70" border="0" cellspacing="0" cellpadding="0" style="margin-top:120px; margin-left:40px;"

tr

td width="100" align="center" class="usename"操作員號：/td

td width="184" align="left"input name="tlrno" type="text" class="dl_text" maxlength="8" tabindex="1"http://td

td width="75" rowspan="2"input name="Submit" type="button" onclick="submit_onclick(this.form)" value="" class="dl_but" tabindex="3"http://td

/tr

tr

td align="center" class="usename"密 　碼：/td

td align="left"input name="pwd" type="password" class="dl_text" maxlength="10" tabindex="2"/

%-- input type="hidden" name="MACAddr"/--%

/td

/tr

tr

td/td

td colspan="2"font size="2"html:errors//font/td

/tr

/table

/html:form

/td

/tr

tr

td height="65" class="diwen"?/td

/tr

/table

你可以自己換一下背景顏色或者背景圖片 其他的都挺好 這是一個(gè)給銀行操作員登錄的界面 你看看吧

css樣式是什么

CSS就是一種叫做樣式表（stylesheet）的技術(shù)。也有的人稱之為層疊樣式表（Cascading Stylesheet）。

在主頁制作時(shí)采用CSS技術(shù)，可以有效地對頁面的布局、字體、顏色、背景和其它效果實(shí)現(xiàn)更加精確的控制。

只要對相應(yīng)的代碼做一些簡單的修改，就可以改變同一頁面的不同部分，或者頁數(shù)不同的網(wǎng)頁的外觀和格式。

它的作用可以達(dá)到：

（1）在幾乎所有的瀏覽器上都可以使用。

（2）以前一些非得通過圖片轉(zhuǎn)換實(shí)現(xiàn)的功能，現(xiàn)在只要用CSS就可以輕松實(shí)現(xiàn)，從而更快地下載頁面。

（3）使頁面的字體變得更漂亮，更容易編排，使頁面真正賞心悅目。

（4）你可以輕松地控制頁面的布局 。

（5）你可以將許多網(wǎng)頁的風(fēng)格格式同時(shí)更新，不用再一頁一頁地更新了。你可以將站點(diǎn)上所有的網(wǎng)頁風(fēng)格都使用一個(gè)CSS文件進(jìn)行控制，只要修改這個(gè)CSS文件中相應(yīng)的行，那么整個(gè)站點(diǎn)的所有頁面都會(huì)隨之發(fā)生變動(dòng)。

想一想，沒有使用CSS前我們是如何控制字體的顏色和大小以及所使用的字體的？我們一般使用HTML標(biāo)簽來實(shí)現(xiàn)，代碼非常煩瑣。

很難想象，如果在一個(gè)頁面里需要頻繁地更替字體的顏色大小，最終生成的HTML代碼的長度一定臃腫不堪。

說實(shí)話，CSS就是為了簡化這樣的工作誕生的，當(dāng)然其功能決非這么簡單。

CSS是通過對頁面結(jié)構(gòu)的風(fēng)格控制的思想，控制整個(gè)頁面的風(fēng)格的。

式樣單放在頁面中，通過瀏覽器的解釋執(zhí)行，是完全的文本，任何懂得HTML的人都可以掌握，非常的容易。生殖對一些非常老的瀏覽器，頁不會(huì)產(chǎn)生頁面混亂的現(xiàn)象。

在網(wǎng)頁中如何添加CSS樣式表?

1.首先打開EditPlus軟件，新建一個(gè)樣式表文件，寫入一些樣式，如下圖所示。

2.接下來我們在建立一個(gè)樣式表文件，在這個(gè)樣式表文件中通過import屬性導(dǎo)入上一個(gè)樣式表，如下圖所示。

3.然后在html中我們用link標(biāo)簽導(dǎo)入上面聲明的樣式文件，如下圖所示。

4.接下來我們運(yùn)行HTML文件，我們可以看到雖然只導(dǎo)入了一個(gè)樣式文件，但是兩個(gè)樣式表的樣式都加載進(jìn)來了，如下圖所示。

5.另外在運(yùn)用import的時(shí)候一定不要放在樣式下面，如下圖所示，這樣是不生效的。

6.最后運(yùn)用import導(dǎo)入樣式也不要忘了分號，如下圖所示，忘了分號也是不生效的。

名稱欄目：酷炫登錄頁面和css樣式,HTML5酷炫登錄頁面
文章來源：http://chinadenli.net/article18/dsephgp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站收錄、建站公司、手機(jī)網(wǎng)站建設(shè)、面包屑導(dǎo)航、品牌網(wǎng)站建設(shè)、電子商務(wù)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)