前端之CSS

什么是CSS?

在標簽上設置標簽的style屬性。

編寫CSS的方法

一、直接在標簽中寫style屬性。

二、在head標簽中寫style標簽,這里就需要選擇器選擇所需的標簽

1、id選擇器,以#開頭,例子如下:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
<!--    定義了id為i1的使用style--><style>#i1{background-color:blue;}</style>
</head>
<body><div>Treelight</div><div id="i1">Alex</div><div>Syvia</div><div>HeMinLing</div>
</body>
</html>

2、類選擇器,以.開頭

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
<!--    定義了類名為c1標簽的使用style--><style>.c1{background-color:blue;}</style>
</head>
<body><div>Treelight</div><div>Alex</div><div class="c1">Syvia</div><div>HeMinLing</div>
</body>
</html>

3、標簽選擇器,例子如下:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
<!--    定義了span標簽的使用style--><style>span{background-color:blue;}</style>
</head>
<body><div>Treelight</div><div>Alex</div><div>Syvia</div><div>HeMinLing</div><span>Diana</span>
</body>
</html>

4、層級選擇器

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
<!--    定義了div標簽中的span標簽的使用style(中間用空格分開),標簽可用以點開頭的類或以#開頭的id代替-->
    <style>div span{background-color:blue;}</style>
</head>
<body><div>Treelight<span>30歲</span></div><div>Alex</div><div>Syvia</div><div>HeMinLing<span>18歲</span></div>
</body>
</html>

5、組合選擇器

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
<!--    此處定義的標簽或類或ID(用逗號分隔)均可用此style-->
    <style>div,span{background-color:blue;}</style>
</head>
<body><div>Treelight<span>30歲</span></div><div>Alex</div><div>Syvia</div><div>HeMinLing<span>18歲</span></div>
</body>
</html>

?

6、屬性選擇器

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
<!--    此處定義了具有屬性n="30"的div標簽可用此style,其中標簽可用類或id代替--><style>div[n="30"]{background-color:blue;}</style>
</head>
<body><div n="30">Treelight<span>30歲</span></div><div>Alex</div><div>Syvia</div><div>HeMinLing<span>18歲</span></div>
</body>
</html>

優先級:

1、直接在標簽中添加style屬性最優。

2、在head中的style標簽中,如有沖突,最后定義的屬性優先。

在標簽中定義多個類class="c1 c2"

7、css還可存在于文件中,然后可在html的頭標簽中利用link標簽,示例如下:

css樣式文件

.c1{
background-color:red;}.c2{
background-color:green;}

html文件

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
<!--    此處引用了commons.css樣式--><link rel="stylesheet" href="commons.css">
</head>
<body><div>Treelight<span>30歲</span></div><div class="c1">Alex</div><div class="c2">Syvia</div><div>HeMinLing<span>18歲</span></div>
</body>
</html>

?CSS中常用屬性

一、border:設置邊框的寬度、顏色、樣式

二、height:標簽高度,單位像素,不能使用百分比

三、width:標簽寬度,單位可為像素或百分比

四、text-align:center:水平居中

五、line-height:<標簽高度>:可實現垂直居中

六、color:red:字體顏色

七、font-size:num:字號

八、font-weight:bold:加粗

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<div style="border:1px solid red;
height:50px;
width:400px;
text-align:center;
line-height:50px;
color:blue;
font-size:20px;
font-weight:bold">Treelight
</div>
</body>
</html>

九:float:<left><right>:使得塊級標簽可堆疊

clear:both:使用情況如下:如果父級標簽沒設置高度,此時可在子級標簽(設置了浮動)下加上一個樣式clear:both,清除浮動,此時可撐起父級標簽。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><div style="width:80%;background-color:red;float:left">Treelight</div><div style="width:20%;background-color:blue;float:right">Alex</div>
</body>
</html>

十、display屬性:

display:inline:使得塊級標簽有多少占多少

display:block:使得行內標簽占一行

display:inline-block:使得標簽有多少占多少;可以設置高度,寬度,padding? margin

display:none:使得標簽消失

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><div style="display:inline;background-color:red">Treelight</div><span style="display:block;background-color:blue">Alex</span>
</body>
</html>

默認情況下,行內標簽無法設置高度、寬度等,但以下程序使用display則可實現

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><span style="width:600px;height:100px;display:inline-block;background-color:blue">Alex</span>
</body>
</html>

?十一、margin屬性:外邊距,就是標簽的外邊框與上一層標簽之間的距離

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><div style="height:60px;border:1px solid blue"><div style="margin:0px">Treelight</div></div>
</body>
</html>

十二、padding屬性:內邊距,標簽的內邊框與標簽內容的距離。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><div style="height:60px"><div style="padding:10px;background-color:red;border:3px solid blue">Treelight</div></div>
</body>
</html>

?寫html注意事項

1、應該在最外面設置絕對寬度(像素》,然后在里面用百分比

十三、postion屬性

1、fixed:另起一層,可固定在頁面的一個地方

案例一 :返回頂部按鈕固定在右下角

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title>
</head>
<body>
<div style="height:800px;border: 1px solid red"></div>
<div style="position: fixed;bottom:5px;right:5px;background-color: black;color:white">返回頂部</div>
</body>
</html>

案例二:頭部內容永遠固定在頁面的最上面

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><style>.pg-header{height:48px;position:fixed;top:0;left:0;right:0;background-color:black;color:white}.pg-body{margin-top:53px;border:1px solid red;height:800px}</style>
</head>
<body>
<div class="pg-header">頭部</div>
<div class="pg-body">內容</div>
</body>
</html>

2、relative、absolute:一般一齊來用,比如一個div設置了一個position屬性為relative,則此div的子div可設置屬性為absolute,則子div的位置則是相對于父div的位置

案例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<div style="width:980px;height:200px;margin:0 auto;position:relative;border:1px solid red;"><div style="background-color:black;position:absolute;top:0;left:0;width:50px;height:50px"></div>
</div>
<div style="width:980px;height:200px;margin:0 auto;position:relative;border:1px solid red;"><div style="background-color:black;position:absolute;top:0;right:0;width:50px;height:50px"></div>
</div>
<div style="width:980px;height:200px;margin:0 auto;position:relative;border:1px solid red;"><div style="background-color:black;position:absolute;bottom:0;left:0;width:50px;height:50px"></div>
</div>
</body>
</html>

十四、opacity:透明度,值為0-1之間

十五、z-index:層級;越大就在上面

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>.layer1{border:1px solid red;height:5000px;}.layer2{position:fixed;top:0;right:0;left:0;bottom:0;z-index:9;opacity:0.5;background-color:black}.layer3{position:fixed;top:50%;left:50%;height:100px;width:250px;margin-top:-100px;margin-left:-250px;z-index:10;background-color:white;}</style>
</head>
<body>
<div class="layer1">第一層
</div>
<div class="layer2">第二層
</div>
<div class="layer3"><input type="text "\><input type="text "\><input type="text "\>
</div></body>
</html>

十六、overflow:應用場景:父div中含有一個img標簽,而此標簽中的圖片的寬、長比父div的大,則overflow設置為auto或scroll則會出現滾動條。設為hidden,則超出的范圍不顯示。

案例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<div style="height:400px;width:400px;overflow:auto"><img src="1.jpg"\>
</div></body>
</html>

?十七、hover

使用方法:在style標簽中,.<classname>:hover,表示此樣式,在鼠標移動到對應的classname的標簽上才應用

案例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>.pg-header{background-color:blue;height:48px}.pg-header .content{width:1000px;margin:0 auto;line-height:48px;}.topic{float:left;padding:0px 40px}.topic:hover{background-color:red}</style>
</head>
<body>
<div class="pg-header"><div class="content"><div class="topic">全部</div><div class="topic">42區</div><div class="topic">段子</div><div class="topic">圖片</div><div class="topic">挨踢1024</div></div>
</div>
<div class="pg-body">a
</div></body>
</html>

?十八、background-color:設置背景顏色

十九、background-image:url(path):設置背景圖片,默認情況下會占滿整個標簽。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<div style="background-image:url(4.gif);height:150px"></div>
</body>
</html>

二十、background-repeat:no-repeat:設置圖片不重復

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<div style="background-image:url(4.gif);height:150px;background-repeat:no-repeat"></div>
</body>
</html>

?二十一、background-repeat-x background-repeat-y:no repeat:設置不在x或y方向重復

二十二、background-position-x、background-position-y:設置背景圖片的位置

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<div style="height:100px"><div style="background-image:url(2.png);height:19px;background-repeat:no-repeat;width:20px;border:1px solid red;background-position-y:10px"></div>
</div>
</body>
</html>

?案例:用戶登錄框

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<div><div style="width:980px;height:48px;margin:0 auto"><div style="color:red;line-height:48px;font-size:20px;float:left">*</div><div style="line-height:48px;font-size:20px;float:left;margin-left:10px">用戶名</div><div style="height:48px;width:400px;float:left;margin-left:10px;position:relative"><input type="text" style="height:48px;width:370px;padding-right:30px" \><span style="background-image:url(i_name.jpg);height:48px;display:inline-block;width:30px;background-repeat:no-repeat;position:absolute;right:0;top:20px;
"                        ></span></div></div>
</div></body>
</html>

?案例:后臺管理頁面(左側菜單不動,右側的內容可動)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>.pg-header{background-color:#3825a2;height:48px;color:white;}body{margin:0;}.pg-content .menu{position:fixed;top:48px;left:0;bottom:0;width:200px;background-color:red;}.pg-content .content{position:fixed;top:48px;left:200px;bottom:0;right:0;background-color:green;overflow:auto;}</style>
</head>
<body>
<div class="pg-header"></div>
<div class="pg-content"><div class="menu">a</div><div class="content"><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p></div>
</div>
<div class="pg-footer"></div>
</body>
</html>

?案例:后臺管理頁面(左側菜單可隨著滾動條移動)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>.pg-header{background-color:#3825a2;height:48px;color:white;}body{margin:0;}.pg-content .menu{position:absolute;top:48px;left:0;bottom:0;width:200px;background-color:red;}.pg-content .content{position:absolute;top:48px;left:200px;bottom:0;right:0;background-color:green;}</style>
</head>
<body>
<div class="pg-header"></div>
<div class="pg-content"><div class="menu">a</div><div class="content"><div style="background-"><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p></div></div>
</div>
<div class="pg-footer"></div>
</body>
</html>

案例:后臺管理頁面(左側菜單不動,右側的可滾動)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>.pg-header{background-color:#3825a2;height:48px;color:white;}body{margin:0;}.pg-content .menu{position:absolute;top:48px;left:0;bottom:0;width:200px;background-color:red;}.pg-content .content{position:absolute;top:48px;left:200px;bottom:0;right:0;background-color:green;overflow:auto;}</style>
</head>
<body>
<div class="pg-header"></div>
<div class="pg-content"><div class="menu">a</div><div class="content"><div style="background-"><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p></div></div>
</div>
<div class="pg-footer"></div>
</body>
</html>

主要是在content中添加了overflow:auto,則此標簽可流動

建議加上mini-width,則少于mini-width出現橫排滾動條,防止變形。

案例:鼠標放到父標簽上,其中的一個子標簽可顯示紅色背景

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>.item:hover .item2{background-color:red}</style>
</head>
<body>
<div class="item"><div class="item1">123</div><div class="item2">456</div>
</div>
</body>
</html>

?案例:后臺管理(用戶菜單的顯示和隱藏)

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>.pg-header{background-color:#3825a2;height:48px;color:white;}.pg-header .logo{width:200px;height:48px;background-color:#3cb572;line-height:48px;text-align:center;}.pg-header .login{width:200px;height:48px;background-color:#a97c38;postion:relative;}.pg-header .login:hover{background-color:blue;}body{margin:0;}.pg-content .menu{position:absolute;top:48px;left:0;bottom:0;width:200px;background-color:red;}.pg-content .content{position:absolute;top:48px;left:200px;bottom:0;right:0;background-color:green;overflow:auto;z-index:10;}.left{float:left;}.right{float:right;}.pg-header .login a img{width:40px;height:40px;border-radius:50%;margin-top:5px;}.pg-header .login .usermenu{position:absolute;top:48px;right:120px;z-index:20;width:80px;height:60px;padding:10px;background-color:red;}.hide{display:none}.login:hover .usermenu{display:block}</style>
</head>
<body>
<div class="pg-header"><div class="logo left">老男孩</div><div class="login right"><a><img src="1.jpeg"></a><div class="usermenu hide"><a style="display:block">我的資料</a><a style="display:block">注銷</a></div></div>
</div>
<div class="pg-content"><div class="menu">a</div><div class="content"><div style="background-"><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p><p>asdf</p></div></div>
</div>
<div class="pg-footer"></div>
</body>
</html>

?

?

圖標使用

網絡上具有大量的圖標提供,可直接使用,如http://www.fontawesome.com.cn

一、使用方法

1、下載:http://www.fontawesome.com.cn

2、解壓縮下載文件,并把font-awesome.min.css放在某個文件夾

3、引入:在html中的<head>處加載font-awesome.min.css如下。

link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">

4、使用:參考http://www.fontawesome.com.cn/faicons/,點擊對應的圖標有使用的教程

案例

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><link rel="stylesheet" href="font-awesome.min.css">
</head>
<body>
<i class="fa fa-superpowers" aria-hidden="true" style="font-size:50px"></i>
</body>
</html>

?

轉載于:https://www.cnblogs.com/Treelight/p/11186585.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/277231.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/277231.shtml
英文地址,請注明出處:http://en.pswp.cn/news/277231.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

[asp]統計在線人數情況

[asp]統計在線人數情況 以前ASP版本的統計在線。因為是從以前的系統中提取出來的。使用的話要修改下。 IfCbool(Application("MARKONLINE")) TrueThenCheckOnline()FunctionCheckOnline() DIMIP,rsPrv,Sql IfDBSTATE FalseThenDbOpen() SetrsPrvServer.Crea…

android 局域網鄰居,局域網內無鄰居 它們去哪兒了?

最近不知道是炎炎夏日的原因&#xff0c;還是部分地區雨水過多的問題&#xff0c;造成了好多小伙伴反應說&#xff0c;無法在網絡中看到同在一個局域網中的其他電腦、服務器或打印機。這個問題說大不大&#xff0c;說小不小&#xff0c;但很難用幾句話把問題解決&#xff0c;所…

svg 線條動畫淺嘗

看了別人網站的svg動畫覺得非常舒服,自己嘗試實現一下效果如下: 實現需要明白2個關于svg的css屬性 1. stroke-dasharray stroke-dasharray: <percentage> | <length> | inherit數與數之間用逗號或者空白隔開&#xff0c;指定短劃線和缺口的長度。如stroke-dasharr…

Ajax 的亂碼問題(2)

上次說的是“發送數據”時亂碼的處理方法。那么“接收數據”呢&#xff1f;亂碼問題弄得我快瘋了&#xff0c;所以廢話也不多說了&#xff0c;總結如下&#xff1a;服務端&#xff1a;///<summary>///Ajax 格式數據到本地客戶端///</summary>///<param name&quo…

《子彈筆記術》[日]杉野干人(作者)epub+mobi+azw3格式下載

下載地址&#xff1a;點我下載后手機可瀏覽內容簡介在工作中&#xff0c;越是復雜的項目&#xff0c;需要記錄的事情越多&#xff0c;花費的時間自然也越多。如果使用傳統筆記方法&#xff0c;規劃將變成苦差事。子彈筆記術的核心是快速收集和處理信息&#xff0c;它可以幫助你…

html廣告條效果,css3炫酷網站banner廣告動畫特效

這是一款可以用來遮罩網站banner或廣告的動畫特效插件。該特效使用的是 CSS3 animations。注意不是所有的瀏覽器都支持 CSS3 animations。如果你對 CSS3 animations還不了解&#xff0c;建議你先閱讀W3C CSS Animations。HTMLhtml結構如下&#xff1a;Lost at sea?Relax - wev…

開始測試React Native App(上篇)

前期技術儲備 前言 我是測試小白&#xff0c;小小白&#xff0c;小小小白&#xff0c;最近想在成了一定規模的項目中引入測試&#xff0c;于是找了許些資料學習&#xff0c;現在已經在項目中成功引入。于是想在思路明朗和記憶深刻的時候總結下學習路徑以及寫測試中遇到的難點、…

mysql 5中的store function

mysql 5中的store function mysql 5中新增了視圖&#xff0c;存儲過程&#xff0c;觸發器等新功能&#xff0c;其中不少資料對其都有介紹&#xff0c;今天看到了其中的一個叫store function的功能&#xff0c;和存儲過程有點象&#xff0c;但返回的是值哦&#xff0c;用法挺靈活…

html frame跳轉實例,HTML frame標簽怎么用?frame標簽的具體使用實例

本篇文章主要為大家講述的是關于HTML frame標簽的用法&#xff0c;還有關于frame標簽中的屬性介紹。還有關于frame標簽的使用實例&#xff0c;下面就讓我們一起來看看這篇文章吧首先我們先看看HTML frame標簽的用法&#xff1a;標簽定義 frameset 中的一個特定的窗口(框架)。fr…

java 實現支持向量機

https://github.com/kevin0016/java-SVM

藍橋杯——快速排序(2018JavaB組第5題9分)

快速排序&#xff08;18JavaB5,9’&#xff09; 以下代碼可以從數組a[]中找出第k小的元素。 它使用了類似快速排序中的分治算法&#xff0c;期望時間復雜度是O(N)的。 請仔細閱讀分析源碼&#xff0c;填寫劃線部分缺失的內容。 import java.util.Random; public class Main{pub…

關于蝴蝶背景

Runner 2006-07-04 這些鏈接都比較久遠了&#xff0c;現在大概都失效了。好像有不少人都是這兩只可愛的蝴蝶帶來的&#xff0c;看來這兩只蝴蝶真是我的福星啊。這里再把Flash背景的用法貼出來吧.如果直接點擊鏈接無法顯示頁面&#xff0c;可以把鏈接地址復制到瀏覽器的地址欄里…

html 文本橫豎切換,(橫豎屏切換/強制橫屏)CSS3 transform 怎樣才能中心旋轉?

現在有一個canvas&#xff0c;我希望在(手機和平板)豎屏時能夠把它以中心作為旋轉原點旋轉90(強制橫屏)&#xff0c;但用了transform-origin&#xff0c;無論怎樣設置數值都不能達到目的&#xff0c;是我哪里搞錯了嗎&#xff1f;附CSS代碼&#xff1a;html, body{width: 100%;…

Echarts多任務可視化之再優化

1.上次進程可視化由svg實現&#xff0c;本次改用echarts框架實現。Js文件&#xff1a;loadxmldoc.js&#xff08;用于加載xml文檔&#xff09;echarts.js&#xff08;用來實現有向圖繪制&#xff09;2.思路&#xff1a;Echarts是定義數據對象數組data和連接對象數組links&#…

約 定

十天&#xff0c; 不能見面 &#xff0c;不能打電話或發短信 .這是我和她的約定.十天&#xff0c;要讓一個深愛著她的男人去尊照這樣的約定去做&#xff0c;實在是難以接受。雖然心里有一萬個不愿意&#xff0c;但我知道 &#xff0c;我心里早以做出了選擇.選擇了我愛的&#x…

NIKE LEBRON 13 PERFORMANCE REVIEW

LeBron James signed a lifetime deal with Nike, cementing his already stable position as Nike’s current top endorser. That means it’s no surprise that Nike would use a person in such a position to help lead new innovative technology. But at times, Nike is…

我的專業我的夢作文計算機,我的創新我的夢作文

新時代&#xff0c;新變化。現在二十一世紀&#xff0c;人們都過上了幸福的生活&#xff0c;發明出來的日常用品&#xff0c;電子產品等等&#xff0c;都是根據人們創新的精神建造出來的。現在我們通過了學習&#xff0c;也漸漸體會到了創新的重要性。就像是在動畫片中&#xf…

Ubuntu掛載新硬盤

1、加掛硬盤 Shell代碼 復制代碼sudo hdparm -I /dev/sdb 硬盤硬件安裝后&#xff0c;此命令測試linux系統是否能找到掛載的未分區硬盤 2、創建分區 Shell代碼 復制代碼sudo fdisk /dev/sdb sda是第一塊SCSI硬盤&#xff0c;sdb第二塊&#xff0c;以此類推...物理分區使用a、b…

利用XML實現通用WEB報表打印 盧彥

利用XML實現通用WEB報表打印(1) 盧彥 摘要開發B/S結構的應用程序最頭疼的問題可能就是報表打印了&#xff0c;由于只能采用瀏覽器來作為用戶界面進行交互&#xff0c;所以不能精確控制客戶端的打印機。而很多B/S結構的應用程序常常需要完成非常復雜的報表打印任務。而靠IE自帶的…

增加新分類daily——“每天學了啥?”

如題轉載于:https://www.cnblogs.com/sig3/p/3926538.html