找回密碼 或 安全提問
 註冊
|註冊|登錄

伊莉討論區

搜索
發表文章前請先閱讀相關版規尊貴會員無限觀看附件圖片儲值後自動升級用戶組
無碼流出gefc2siro中出中字
hire me,お姉ちゃjuq 643星乃莉子勇者のお夢見るぅkunoichi

休閒聊天興趣交流學術文化旅遊交流飲食交流家庭事務PC GAMETV GAME
熱門線上其他線上感情感性寵物交流家族門派動漫交流貼圖分享BL/GL
音樂世界影視娛樂女性頻道潮流資訊BT下載區GB下載區下載分享短片
電腦資訊數碼產品手機交流交易廣場網站事務長篇小說體育運動時事經濟
上班一族博彩娛樂

(4月新番)[繁]狼與辛

[超清繁中]霹靂英雄戰

✡ 斗破蒼穹 年番/鬥

(4月新番)[繁]為美好

(4月新番)[簡]怪異與

(4月新番)[繁]狼與辛
C & C++ 語言C# 語言Visual Basic 語言PHP 語言JAVA 語言
查看: 2379|回復: 2
打印上一主題下一主題

[問題][已解決]我該如何將這個HTML文件裡的CSS部分獨立出來?[複製鏈接]

Rank: 6Rank: 6Rank: 6Rank: 6Rank: 6Rank: 6

帖子
89
積分
174 點
潛水值
51520 米
跳轉到指定樓層
樓主
發表於 2013-9-17 10:28 PM|只看該作者|倒序瀏覽
所有積分大於負-100的壞孩子,將可獲得重新機會成為懲罰生,權限跟幼兒生一樣。
本帖最後由 c780702 於 2013-9-18 12:34 AM 編輯

HTML如下:
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  5.         <title> content </title>
  6.         <link href="CSS.css" rel="stylesheet" type="text/css" />        
  7. </head>
  8. <body>
  9.         <div>
  10.         <div style="position:absolute;
  11.         left:40px; top:20px; width:180px; height:88px;
  12.         background-color: #ccc;"></div>
  13.         </div>
  14. </body>
  15. </html>
複製代碼
我希望將HTML裡的
  1. <div style="position:absolute;
  2.         left:40px; top:20px; width:180px; height:88px;
  3.         background-color: #ccc;">
複製代碼
這部分寫在獨立的CSS裡(不知道行不行)


我自己則是測試過如下:
HTML:
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  5.         <title> content </title>
  6.         <link href="CSS.css" rel="stylesheet" type="text/css" />        
  7. </head>
  8. <body>
  9.         <div>
  10.         <div></div>
  11.         </div>
  12. </body>
  13. </html>
複製代碼
CSS:
  1. div{
  2.         style="position:absolute;
  3.         left:500px; top:520px; width:180px; height:88px;
  4.         background-color: #ccc;"
  5. }
  6. div>div:after{
  7.         content: url("wjc.gif");               
  8. }
複製代碼
失敗了,變成無法自己控制定位......



請問我哪裡寫錯了?
...
瀏覽完整內容,請先 註冊登入會員
分享分享0收藏收藏0支持支持0
如果瀏覽伊莉時速度太慢或無法連接,可以使用其他分流瀏覽伊莉,www01.eyny.com(02,03)。

使用道具檢舉

Rank: 3Rank: 3Rank: 3

帖子
663
積分
1128 點
潛水值
20810 米
頭香
發表於 2013-9-17 11:55 PM|只看該作者
本帖最後由 theloserbm 於 2013-9-17 11:56 PM 編輯

css裡很重要的一個東西是class(當然也可以用ID, 可是比較少)
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  5.         <title> content </title>
  6.         <link href="CSS.css" rel="stylesheet" type="text/css" />        
  7. </head>
  8. <body>
  9.         <div>
  10.         <div class="box"></div>
  11.         </div>
  12. </body>
  13. </html>
複製代碼
  1. div.box {
  2.         position:absolute;
  3.         left:500px;
  4.         top:520px;
  5.         width:180px;
  6.         height:88px;
  7.         background-color: #000ccc;
  8. }
複製代碼
div.box是表示"有box這個class的div", css的每一個style的第一行稱為selector, 是學習css重要的一門學問.
如:
#box - id=box的element
.box - 有box這個class的element
.box.pretty - 同時有box和pretty的element (class可以同時有很多個)
input[type=text] - type=text的input
.box:hover - 有box這個class的element被鼠標移上去的時候

還有很多很多... 要進步的話就多用chrome的inspect element, 你可以看到每一個element的style被什麼css rule影響.

...
瀏覽完整內容,請先 註冊登入會員
分享使你變得更實在,可以使其他人感到快樂,分享是我們的動力。今天就來分享你的資訊、圖片或檔案吧。

使用道具檢舉

Rank: 6Rank: 6Rank: 6Rank: 6Rank: 6Rank: 6

帖子
89
積分
174 點
潛水值
51520 米
3
發表於 2013-9-18 12:28 AM|只看該作者
theloserbm 發表於 2013-9-17 11:55 PM
下載: 訪客無法瀏覽下載點,請先 註冊登入會員

css裡很重要的一個東西是class(當然也可以用ID, 可是比較少)div.box是表示"有box這個class的div", css的每 ...

太感謝大大了><
...
瀏覽完整內容,請先 註冊登入會員
分享使你變得更實在,可以使其他人感到快樂,分享是我們的動力。今天就來分享你的資訊、圖片或檔案吧。

使用道具檢舉

您需要登錄後才可以回帖 登錄 | 註冊

Powered by Discuz!

© Comsenz Inc.

重要聲明:本討論區是以即時上載留言的方式運作,對所有留言的真實性、完整性及立場等,不負任何法律責任。而一切留言之言論只代表留言者個人意見,並非本網站之立場,用戶不應信賴內容,並應自行判斷內容之真實性。於有關情形下,用戶應尋求專業意見(如涉及醫療、法律或投資等問題)。 由於本討論區受到「即時上載留言」運作方式所規限,故不能完全監察所有留言,若讀者發現有留言出現問題,請聯絡我們。有權刪除任何留言及拒絕任何人士上載留言,同時亦有不刪除留言的權利。切勿上傳和撰寫 侵犯版權(未經授權)、粗言穢語、誹謗、渲染色情暴力或人身攻擊的言論,敬請自律。本網站保留一切法律權利。
回頂部