當前位置:首頁 » 網頁前端 » web製作樣式表
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

web製作樣式表

發布時間: 2022-06-10 08:49:23

Ⅰ 基於.NET的WEB2.0環境下的CSS樣式表網頁跑版(網頁製作)的問題,希望高人能指點一下。

分三個DIV 然後 DIV里用 <ul> <li></li></ul> 進行分層 然後分別設置樣式 可以先把樣式寫了 直接引用就行
不在公司 沒裝VS 只能給你說思路咯

Ⅱ web前端開發的css應該怎樣寫

新建一個.css的文檔,此方法需要在html的文檔中調用css文檔
調用css文檔用html中<link>標簽來調用
css文檔內容如下:
#divid{
height:20px;
width:15px;

..........
}
.divclass{
內容如上舉例

}
或者在html里嵌套,如下:
在html的<body></body>標簽前在title標簽後,用style標簽如:
<style>
#divid{
內容同上舉例
}

.divclass{
內容如上舉例

}
</style>

Ⅲ 後台web系統界面設計css樣式表

台web系統界面設計css樣式 大

Ⅳ 在asp web 開發中,怎麼使用css樣式表,css樣式文件里的內容要自己寫嗎希望得

是的,CSS樣式表需要自己設計和編寫
你可以找一點相關資料學習起來,div+css不是很難

Ⅳ 網頁樣式表的作用是什麼,使用方法有哪幾種

實際上你可以使用4種方法。每種方法都有其不同的優點:

1.將樣式表植入HTML文件中。
2.將一個外部樣式表鏈接到HTML文件上。
3.將一個外部樣式表輸入到HTML文件中。
4.將樣式表加入到HTML文件行中。

植入樣式表:

這就是我們在上一頁中用的方法,所有的樣式表信息都列於HTML文件的頂部,同<BODY>分列,例:
<HTML>
<STYLE TYPE="text/css">
<!--
H1 { color: green; font-family: impact }
P { background: yellow; font-family: courier }
-->
</STYLE>
<HEAD>
<TITLE>My First Stylesheet</TITLE>
</HEAD>
<BODY>
<H1>Stylesheets: The Tool of the Web Design Gods</H1>
<P>Amaze your friends! Squash your enemies!</P>
</BODY>
</HTML>

植入樣式表規則後,瀏覽器在整個HTML頁面中都執行該規則。如果你想對網頁一次性加入樣式表,就可採用該方法。

你可能注意到代碼中有兩處很奇怪: TYPE="text/css"屬性和注釋標簽。 TYPE="text/css" 設定採用MIME類型,這樣以來,不支持CSS的瀏覽器可以忽略樣式表。

注釋標簽(<!-- and -->)更為重要。有些老的瀏覽器(如MAC機用的IE 2.0)即使在設定了TYPE="text/css" 屬性時也不能忽略樣式表繼續執行下面的命令,而且還會顯示樣式表的代碼。而使用注釋標簽則可以避免發生這種情況。

鏈接到樣式表上

這里是樣式表功能發揮得淋漓盡致的地方。你可以將多個HTML文件都鏈接到一個中心樣式表文件。這個外部的樣式表文件將設定你所有網頁的規則。如果你改變樣式表文件中的額某一細節,所有頁面都會隨之改變。如果你維護的站點很大,則這項功能絕對會有其用武之地。

它的使用方法:產生一個普通的網頁,但使用<STYLE>規則,而是在<HEAD>內使用<LINK>標簽:

<HTML>
<HEAD>
<TITLE>My First Stylesheet
</TITLE>
<LINK REL=stylesheet HREF="mystyles.css" TYPE="text/css">
</HEAD>
<BODY>
<H1>Stylesheets: The Tool of
the Web Design Gods</H1>
<P>Amaze your friends! Squash
your enemies!</P>
</BODY>
</HTML>

(使用鏈接的樣式表時,你無須使用注釋標簽。)

現在生成一個單另的文本文件,起名mystyles.css (或者其任何你喜歡的名字)。文件內容如下:

H1 { color: green; font-family: impact }
P { background: yellow; font-family: courier }

如同發布HTML文件那樣,將這個CSS文件布到你的伺服器中。在瀏覽器中觀看網時,你會發現瀏覽器將依照鏈接標簽將有鏈接了的HTML網頁按照樣式表的規則示,在HREF屬性中你可以選擇使用絕對相對URL。

輸入樣式表

輸入外部樣式表的方法同鏈接的方法類似。不同之處在於鏈接法不能同其它方法結合使用,但輸入法則可以。例:
<HTML>
<STYLE TYPE="text/css">
<!--
@import url(company.css);
H1 { color: orange; font-family: impact }
-->
</STYLE>
<HEAD>
<TITLE>My First Stylesheet
</TITLE>
</HEAD>
<BODY>
<H1>Stylesheets: The Tool of
the Web Design Gods</H1>
<P>Amaze your friends! Squash
your enemies!</P>
</BODY>
</HTML>

而其中輸入的 company.css文件內容如下:

H1 { color: green; font-family: times }
P { background: yellow; font-family: courier }

Ⅵ dreamweaver建立一個外部樣式怎麼建

層疊樣式表 (CSS) 是一系列格式設置規則,它們控制 Web 頁面內容的外觀。使用 CSS 設置頁面格式時,內容與表現形式是相互分開的。頁面內容(HTML 代碼)位於自身的 HTML 文件中,而定義代碼表現形式的 CSS 規則位於另一個文件(外部樣式表)或 HTML 文檔的另一部分(通常為 <head> 部分)中。使用 CSS 可以非常靈活並更好地控制頁面的外觀,從精確的布局定位到特定的字體和樣式等。

術語「層疊」是指對同一個元素或 Web 頁面應用多個樣式的能力。例如,可以創建一個 CSS 規則來應用顏色,創建另一個規則來應用邊距,然後將兩者應用於一個頁面中的同一文本。所定義的樣式「層疊」到您的 Web 頁面上的元素,並最終創建您想要的設計。

CSS樣式表的創建,可以統一定製網頁文字的大小、字體、顏色、邊框、鏈接狀態等效果。在Dreamweaver 8中CSS樣式的設置方式有了很大的改進,更為方便、實用、快捷。

一、創建CSS樣式

1、選中菜單「窗口」>「CSS樣式」。打開CSS樣式面板。

Ⅶ Web前端面試指導(五十):CSS樣式書寫有哪些

一、CSS書寫順序
1.位置屬性(position, top, right,z-index, display, float等)
2.大小(width, height, padding,margin)
3.文字系列(font, line-height,letter-spacing, color- text-align等)
4.背景(background, border等)
5.其他(animation, transition等)
二、CSS書寫規范
1.使用CSS縮寫屬性
CSS有些屬性是可以縮寫的,比如padding,margin,font等等,這樣精簡代碼同時又能提高用戶的閱讀體驗。
2.去掉小數點前的「0」
3.簡寫命名
很多用戶都喜歡簡寫類名,但前提是要讓人看懂你的命名才能簡寫哦!
4.16進制顏色代碼縮寫
有些顏色代碼是可以縮寫的,我們就盡量縮寫吧,提高用戶體驗為主。
5連字元CSS選擇器命名規范
1)長名稱或片語可以使用中橫線來為選擇器命名。
2)不建議使用「_」下劃線來命名CSS選擇器,為什麼呢?
輸入的時候少按一個shift鍵;瀏覽器兼容問題(比如使用_tips的選擇器命名,在IE6是無效的)能良好區分JavaScript變數命名(JS變數命名是用「_」)
6.不要隨意使用id
id在JS是唯一的,不能多次使用,而使用class類選擇器卻可以重復使用,另外id的優先順序優先與class,所以id應該按需使用,而不能濫用。
7.為選擇器添加狀態前綴
有時候可以給選擇器添加一個表示狀態的前綴,讓語義更明了,比如下圖是添加了「.is-」前綴。
三、CSS命名規范
常用的CSS命名規則
頭:header
內容:content/Container
尾:footer
導航:nav
側欄:sidebar
欄目:column
頁面外圍控制整體布局寬度:wrapper
左右中:left right center
登錄條:loginbar
標志:logo
廣告:banner
頁面主體:main
熱點:hot
新聞:news
下載:download
子導航:subnav
菜單:menu
子菜單:submenu
搜索:search
友情鏈接:friendlink
頁腳:footer
版權:right
滾動:scroll
內容:content
標簽:tags
文章列表:list
提示信息:msg
小技巧:tips
欄目標題:title
加入:joinus
指南:guide
服務:service
注冊:regsiter
狀態:status
投票:vote
合作夥伴:partner
ID的命名-頁面結構
容器: container
頁頭:header
內容:content/container
頁面主體:main
頁尾:footer
導航:nav
側欄:sidebar
欄目:column
頁面外圍控制整體布局寬度:wrapper
左右中:left right center
ID的命名-導航
導航:nav
主導航:mainnav
子導航:subnav
頂導航:topnav
邊導航:sidebar
左導航:leftsidebar
右導航:rightsidebar
菜單:menu
子菜單:submenu
標題: title
摘要: summary
ID的命名-功能
標志:logo
廣告:banner
登陸:login
登錄條:loginbar
注冊:register
搜索:search
功能區:shop
標題:title
加入:joinus
狀態:status
按鈕:btn
滾動:scroll
標簽頁:tab
文章列表:list
提示信息:msg
當前的: current
小技巧:tips
圖標: icon
注釋:note
指南:guild
服務:service
熱點:hot
新聞:news
下載:download
投票:vote
合作夥伴:partner
友情鏈接:link
版權:right
四、注釋規范
/* Header */
內容區
/* End Header */
五、注意事項
1.一律小寫;
2.盡量用英文;
3.盡量不縮寫,除非一看就明白的單詞。
六、CSS樣式表文件命名
主要的 master.css
模塊 mole.css
基本共用 base.css
布局、版面 layout.css
主題 themes.css
專欄 columns.css
文字 font.css
表單 forms.css
補丁 mend.css
列印 print.css

Ⅷ 如何創建一個網站的多個網頁用同一個web樣式表的代碼怎麼寫

你的意思就是寫一個公共樣式表,然後給每一個頁面使用是吧,首先創建一個名為common.css的css文件 名字不一定這樣寫,這里是建議。然後給每一個頁面都導入這個css文件就可以了。

Ⅸ web表格怎樣做得美

下面我們以一個簡單的示例來體會體會一下表單。
最終效果如下:
如何用web表格控制項FineReport做web表格
2
新建表單
點擊文件>新建表單,如下圖
如何用web表格控制項FineReport做web表格
拖入組件
如上圖所示的效果圖,我們可以看到該表單需要有1個下拉框控制項以及對應的1個標簽控制項和一個查詢按鈕,還需要一個以表格形式顯示數據的報表塊和顯示圖表的圖表塊,此時,我們確定了需要在表單中添加一個報表塊,一個圖表塊,3個控制項。
註:在組件介紹中,我們知道控制項即可依附於參數面板組件存在,也可以單獨以組件的形式存在,在這里可隨意使用哪種形式,效果都一樣,那麼使用依附於參數面板組件存在的形式。
參數組件
從工具欄中將參數組件拖拽至表單主體中,並將相應的三個控制項:下拉框、文本控制項和查詢按鈕拖拽至參數組件中,並設置標簽控制項的控制項值為:客戶,如下圖:
如何用web表格控制項FineReport做web表格
報表塊組件
從工具欄中將報表組件也拖拽至表單主體中,如下圖:
如何用web表格控制項FineReport做web表格
註:如果組件數量過多,在web端展示的時候自適應在一頁內顯示會比較擁擠,那麼此時可以在右側下方選中整體框架body,在右側上方的屬性表中將組件縮放修改為自適應原樣縮放,如下圖:
如何用web表格控制項FineReport做web表格
充滿展現區域:是指在web端展示的時候,所有組件自適應充滿整個瀏覽器頁面顯示,不出現滾動條;
自適應原樣縮放:是指在web端展示的時候根據製作表單時候組件大小比例顯示,並不縮放充滿整個web頁面,如果超過頁面大小,會出現滾動條。
其詳細顯示樣式請查看錶單樣式
圖表組件
再從工具欄中將圖表組件拖曳至報表塊組件的下方,如下圖:
如何用web表格控制項FineReport做web表格
控制項綁定數據
定義數據集
效果圖中,新建數據集ds1:SELECT 產品名稱,庫存量,產品.成本價 ,產品.單價 FROM 訂單,訂單明細,產品 where 客戶ID='${company}'and 訂單.訂單ID=訂單明細.訂單ID and 訂單明細.產品ID=產品.產品ID,參數company的默認值為VINET,。
註:參數名字必須與客戶ID下拉框控制項名稱保持一致。
客戶下拉框控制項
選中下拉框控制項拖拽到適當位置,下拉框控制項名設為「company」,數據字典來自FRDemo資料庫的客戶表(數據類型選擇資料庫表,資料庫選擇FRDemo),實際值和顯示值分別為客戶ID和客戶名稱,控制項值為VINET:
如何用web表格控制項FineReport做web表格
報表塊
參數面板與控制項都已經設置好之後,點開報表塊裡面的觸筆按鈕,進行報表塊編輯界面,如下圖:
如何用web表格控制項FineReport做web表格
新建數據集
效果圖中,報表塊裡面要顯示訂單明細數據,根據客戶ID進行過濾,新建數據集ds2:select * from 訂單 where 客戶ID='${company}',company默認值為VINET.
表樣設計
如下圖所示,設計表樣:
如何用web表格控制項FineReport做web表格
點擊左下角的表單按鈕回到表單的設計界面,選中報表塊,可在右側的屬性表中設置其報表塊工具欄是否可見,如下圖:
如何用web表格控制項FineReport做web表格
圖表塊
滑鼠選中圖表塊所在區域,為該圖表綁定數據,圖表數據源來源於數據集數據源,其分類系列設置如下:
如何用web表格控制項FineReport做web表格
條件屬性
由於該圖表塊類型為組合圖,即需要通過圖表條件屬性來修改不同系列的圖表類型,如下圖,新增一個條件屬性,設置當系列序號為3的時候,其坐標軸為次坐標軸,圖表類型為折線圖:
如何用web表格控制項FineReport做web表格
13
註:設置條件選擇系列序號的時候需要與數據綁定時的數據列順序相匹配,在上圖設置圖表數據時,庫存量、成本價和單價的系列序號依次為1、2、3,條件屬性主要是設置庫存量系列用柱形圖展示,成本價和單價用折線圖展示並使用次坐標軸。在添加一個組合圖時,會默認添加2個條件屬性,詳細請查看組合圖
到此為止,表單就已經製作好了。

Ⅹ vs.net2005 web頁面如何使用css樣式文件

創建和應用
CSS
樣式表
除了為單個元素設置內聯樣式之外,還可以創建和應用級聯樣式表
(CSS)
文件。級聯樣式表使您可以定義可應用於多個控制項和頁面的樣式,而不必分別編輯元素。
在演練的本節中,將創建樣式表,該樣式表使您可以使用用於設置內聯樣式的相同工具。然後將樣式表應用於正在編輯的頁面。
創建樣式表
在解決方案資源管理器中,右擊網站的名稱(如
C:\WebSites),再單擊「添加新項」。
在「Visual
Studio
已安裝的模板」之下單擊「樣式表」。
在「名稱」框中,鍵入「dark.css」,再單擊「添加」。
編輯器打開一個包含
body
樣式元素的新樣式表。
將插入點定位在左右大括弧
({
})
之間,然後在「樣式」菜單上單擊「生成樣式」。
出現「樣式生成器
-
body」對話框。
單擊「字體」,在「字體屬性」下單擊位於「顏色」框右邊的省略號「(…)」,在「顏色選取器」對話框中單擊一種亮色,再單擊「確定」。
注意
請確保選擇一種與網站網頁的默認顏色不同的顏色。
單擊「背景」,單擊一種與前面步驟中選定的字體顏色對比的暗色(如「褐紫紅色」),再單擊「確定」關閉「樣式生成器
-
body」對話框。
將插入點定位到
body
元素的右大括弧之後,右擊,再單擊「添加樣式規則」。
出現「添加樣式規則」對話框。
「添加樣式規則」對話框使您可以創建綁定到特定
HTML
元素類型、樣式類名或特定元素的新樣式。
單擊「類名」,然後在框中鍵入「reverse」。
這樣將創建一個名為
.reverse
的新樣式類。將能夠把為
.reverse
定義的樣式設置應用於頁上的任何元素。還可以選擇創建類,以便它只能應用於特定類型的元素(定位點、按鈕等),但是在本演練中將創建一個簡單的樣式類。
單擊「確定」以關閉「添加樣式規則」對話框。
使用樣式生成器或
IntelliSense
功能將
.reverse
樣式的顏色設置為與主體樣式的顏色相反的顏色。元素類似於如下所示:
.reverse
{
background-color:white;
color:maroon;
}
既然有樣式表,那麼可以在正在編輯的頁中對其進行引用。
在網頁上引用樣式表
打開
Default.aspx
頁並切換到「設計」視圖。
從解決方案資源管理器中,將
dark.css
文件拖動到頁面上。
頁面已更新,並顯示樣式表的效果。
單擊「正方形」,然後在「屬性」中設置「CssClass」「reverse」。
這樣將反轉樣式應用於「正方形」。
切換到「源」視圖。

<head>
元素中,可以看到編輯器已經添加了引用樣式表的
<link>
元素。還可以看到
<asp:button>
元素的
cssclass
屬性已設置為
reverse。
右擊該頁,再單擊「在瀏覽器中查看」。
該頁出現在瀏覽器中,且已應用樣式表。