Dreamweaver 20090514 上課小記

************************20090514 徐國堂 **************************

版面製作

• 表格
• 內容與結構混合在一起
  
• CSS
• float
• position
• static
• relative
• fixed
• absolute

CSS 套用方法

• inline 行內樣式
• embed 嵌入
• link
• 部落格常常使用link的方式連結外部的CSS
  
• @import

練習行內樣式
開新檔案 --> 輸入一些練習文字 並選取文字

在下方的屬性畫面
--> HTML --> 段落
--> CSS --> 目標規則:新增行內樣式 --> 編輯規則
--> 字型 --> 輸入 Font-size: 13 --> Color: 選取顏色 --> 區塊標籤 --> Letter-spaceing: 3 px --> 確定


*body標籤內的就是網頁的內容及架構(沒有經過修飾)
*即時檢視 對網頁跟資料庫連接很方便

Lab:
建立一個新檔案 sample.html 複製 index.html內的 body標籤內的內容 到sample.html 檔案body標籤內
建立一個新的CSS檔案為 sample.css
於sample.html 設定外部連結 sample.css

*架構了解(自行繪製網頁的區塊) 才能編輯CSS
*一個頁面只有一個body標籤

*CSS

• body
• text-align: 要求文字排列方式
• 例如 text-align: center; 就是文字都要置中
  
• border:solid 1px; 邊線為實線 寬度為 1 px
  
• width:550px; 寬度為550 像素
  
• margin-left:auto;
  
• margin-right:auto; 當左右的 margin 都設定為auto 就是置中
• font-size: 1.25em 字型大小為瀏覽器的1.25倍
• padding-top: 20px 向上留白(填滿) 20px
• padding-bottom: 20px 向下留白(填滿) 20px
• margin-top: 0px 上邊界 0 px
• margin-bottom: 0px 下邊界 0 px

Box moudle
*padding 包含背景區域
*margin 有負邊界
*padding 沒有負邊界, 有背景及margin 才會設定padding

*CSS的大小單位

• px 像素
• em 相對於瀏覽器文字大小的倍數

***************************************************************

Dreamweaver 20090512 上課小記

************************20090512 徐國堂 **************************

設計網頁主要的區域

• Logo
• banner
• main navigation
• sub navigation
• 內容
• 廣告

• copyright

顯示器的設定一定要設定為 1280x1024 導引線比較好拉

*開啟尺規 好建立導引線

• 檢視 --> 尺規 --> 顯示

做網頁

1. 先規劃網頁的區塊
2. 建立導引線
3. 繪製AP Div 填入背景
   

繪製AP Div(插入 --> 版面物件 --> AP Div)

• AP 是絕對位置
  

F12 預覽網頁
建議使用 巢狀AP Div (編輯 --> 偏好設定 --> AP 元素 --> 勾選 如果在AP Div 中則使用巢狀)

sans-serif 為系統的無襯邊字型

HTML 類型

• block: 要求左右兩邊不允許有其他的東西存在
• inline: 左右兩邊允許有其他的東西存在

將網頁置中

• 將檢視模式切換到分割
  
• 選取body標籤內部的內容(不含body標籤)
• 插入 --> 版面物件 --> Div 標籤
• ID: main --> 新增CSS規則 --> 確定
  
• 方框 --> Width: 900 Margin 內 Right:auto Left:auto
  
• 定位 --> Position:relative
• 點選確定 使其生效, 目前看起來網頁 有上下邊界距離
• 點選工具列上面的 修改 --> 頁面屬性 (Ctrl + J)
• 在外觀(CSS) 將上下左右邊界 設定為0 --> 確定
• 這個時候網頁就已經置中 然後邊界是貼著網頁
  
• 將CSS 變成連結外部CSS(所以新建立一個新的CSS檔案讓這個網頁連結)
• 點選工具列上面的 檔案 --> 開新檔案 Ctrl + N --> 選取CSS --> 建立
• 點選工具列上面的 檔案 --> 儲存檔案(建議css建立一個資料夾獨立儲存)
• 切換回來原來的index.html 在原來的CSS樣式 點選 附加外部樣式表(長相像鎖鏈的圖示)
  
• 點選瀏覽 --> 選取 剛剛建立的新的CSS檔案 --> 確定 --> 確定
• 將原來CSS樣式內的style 標籤的所有東西選取起來(利用shift按鍵) 使用滑鼠左鍵 拖曳到 sample.css(剛剛建立的css)
• 這個時候在程式碼內 會觀察到有 link href="css/sample.css" rel="stylesheet" type="text/css" 連結到外部的css
• 儲存所有檔案 使用F12 檢視網頁 --> Finish
  

***************************************************************

20090511 opensolaris 社群者大會note

Advantages

• ZFS – revolutionary file system

• DTrace – dynamic tracing

• Scalability, reliability, observability

• Security (incl, trusted extensions )

• compatibility guarantee (stable API)

• Free & open source, but supported

Package manager → Image Package System

#pkg image-update <升級到最新>

• 會建立 新的Boot Environment(BE)

• 建立新的GRUB Entry

• take snapshot of old BE ( 置於另外一個ZFS)(類似VMWare 的link-clone, 比較不佔空間)

Fast Graphical Reboot

#reboot -f

More Linux Familiarity

• pfexec 類似sudo

openSolaris 預設不能在Live 安裝的時候選套件

Auto install

• caiman project

自訂自己的opensolaris

#distro_const build slim_cd.xml

Crossbow (尚未Release!!)

• Virtual NICs(VNICs)

• Flow control

http://genuinx.org 可以下載到最新的OpenSolaris

Multi-Booting

• One Hardware – Many OS

• One OS – Many Hardware

Solaris Partition 的system id → bf ( solaris 2)

• 如果設定為82 (solaris 1 ) 會被linux 當成swap

:

Network manager

• Network Auto-magic

Dreamweaver 20090505上課小記

************************20090505 徐國堂 **************************

段落

CSS like shell in the linux --> interface for web contents 把網頁內容透過CSS 輸出成想呈現的畫面

Cascading Style Sheets（層疊樣式表／串樣式列表），簡寫為CSS，由W3C定義和維護的標準，一種用來為結構化文檔（如HTML文檔或XML應用）添加樣式（字體、間距和顏色等）的計算機語言。

***************************************************************

Freemind on website

最近都在使用Freemind 整理東西
所以也希望用 web的方式
來整理自己的研究進度 還有待辦事項

參考 程式旅人 - 學習紀事 - http://nio127.blogspot.com/2009/03/freemind.html

將 http://www.efectokiwano.net/mm/freeMindFlashBrowser.zip 下載並解開 FlashBrowser

將以下三個檔案上傳到 Google pages
flashobject.js
mindmaps.html
visorFreemind.swf

於網頁中 輸入以下程式碼 (以下程式碼前後 加上 < 及 > )

embed src="http://sakanamax.googlepages.com/visorFreemind.swf" width="100%" type="application/x-shockwave-flash" align="middle" height="1000" bgcolor="#FFFFFF" quality="high" flashvars="openUrl=_blank&initLoadFile=http://sakanamax.googlepages.com/IDSsurvey.mm&startCollapsedToLevel=5"

接下來只要將 心智圖的 .mm 檔案上傳就可以
以網頁的方式來呈現了
相關效果如下

Freemind on openSUSE 11.1

之前就覺得 Freemind 是一個不錯的軟體
可以整理自己的思緒 還有週邊的工作

相關圖片 引用自 http://freemind.sourceforge.net/FreeMind-learning-german.png


在Windows 的平台都是使用免安裝版
在我的notebook上面也想裝Freemind來整理自己的相關待辦事項

在Freemind的官方網頁
http://freemind.sourceforge.net/wiki/index.php/Main_Page

有download 頁面
但是把 freemind的相關rpm 下載下來會發現
有些相關性的套件 沒有在套件庫內存在
所以就找了一下資料

相關頁面
http://freemind.sourceforge.net/wiki/index.php/FreeMind_on_Linux#Installation_of_FreeMind_0.8.1_under_SuSE_10.3

使用YaST2 套件庫模組 新增3個套件庫
可以點選 電腦 --> YaST --> 軟體套件庫
或是在終端機輸入
# yast2 repositories

然後點選新增 --> 指定URL --> 輸入套件庫URL 及名稱 --> 下一步
就可以順利新增套件庫
要新增兩個指定 URL 的套件庫
http://eric.lavar.de/comp/linux/rpm/noarch
http://mirrors.dotsrc.org/jpackage/1.6/generic/free

以及一個社群套件庫
主要套件庫( 非-OSS)

安裝完套件庫之後
就可以在YaST 內的軟體管理
或是在終端機內輸入
#yast2 sw_single

看到 freemind 這個軟體
直接安裝就可以使用

enjoy your freemind ~~
---------------------------------------------------原文參考------------------------------------------------------------------------

1. Add software repositories using YaST:
   1. Add URL http://eric.lavar.de/comp/linux/rpm/noarch (repomd.xml is not signed, ignore YaST complains)
   2. Add community repository Main non-OSS (for Sun's Java)
   3. Add Jpackage URL free, generic and version 1.6, using the list of JPackage mirrors (http://jpackage.org/mirroring.php#mirrors), e.g.
      • http://mirrors.dotsrc.org/jpackage/1.6/generic/free (repomd.xml is not signed, ignore YaST complains)
2. Using YaST's software management, search for 'freemind' and install what you see and like.
3. Also using YaST's software management, make sure that java-1_5_0-sun or java-1_6_0-sun is installed (search for '-sun').
4. And make sure that FreeMind uses the right Java (not gcj as per default).

----------------------------------------------------------------------------------------------------------------------------------------

NFSv4 在 opensuse 11.1

在OpenSuse 11.1 的YAST管理模組內有支援 NFSv4
在/etc/exports 內的設定 舉例來說
/srv/ftp/install/opensuse11.1/DVD *(fsid=0,ro,root_squash,sync,no_subtree_check)

啟動 nfs server (#rcnfs 為NFS client, #rcnfsserver 為NFS Server)
#rcnfsserver start

選項
fsid=0 為NFSv4的選項, 定義 NFSv4 中的根目錄，只能有一個
no_subtree_check 不做上層目錄權限的檢查, 可加快速度


用戶端 掛載時 也要注意掛載方式

• mount 不指定類型 還是以 nfsv3 來掛載
  

linux-7lre:~ # mount 192.168.1.128:/ /mnt/nfs
mount.nfs: access denied by server while mounting 192.168.1.128:/

• 所以要指定 -t nfs4 的類型來掛載
• 掛載的來源資料夾為 / 就不是 /srv/ftp/install/opensuse11.1/DVD 的方式
  

linux-7lre:~ # mount -t nfs4 192.168.1.128:/ /mnt/nfs

• 驗證掛載
  

linux-7lre:~ # df
Filesystem 1K-blocks Used Available Use% Mounted on
/dev/sda2 9550788 4019660 5045968 45% /
udev 257536 100 257436 1% /dev
gvfs-fuse-daemon 9550788 4019660 5045968 45% /root/.gvfs
192.168.1.128:/ 30961728 8859904 20529088 31% /mnt/nfs

linux-7lre:~ # ls /mnt/nfs
ARCHIVES.gz content.asc gpg-pubkey-7e2e3b05-4816488f.asc
ChangeLog content.key gpg-pubkey-9c800aca-481f343a.asc
GPLv2.txt control.xml gpg-pubkey-a1912208-446a0899.asc
GPLv3.txt directory.yast images
INDEX.gz docu license.tar.gz
README dosutils ls-lR.gz
README.DOS gpg-pubkey-0dfb3188-41ed929b.asc media.1
SuSEgo.ico gpg-pubkey-307e3d54-481f30aa.asc openSUSE11_1_LOCAL.exe
autorun.inf gpg-pubkey-3d25d3d9-36e12d04.asc openSUSE11_1_NET.exe
boot gpg-pubkey-3dbdc284-49144c3f.asc pubring.gpg
content gpg-pubkey-56b4177a-47965b33.asc suse

相關的Lab還要多嘗試 ^__^

移除opensuse桌面上的 Icon

OpenSuSE 的桌面上有兩個圖示

一般使用者沒辦法刪除,卡在桌面上也覺得卡卡的
所以就想個辦法把他移除啦, 讓桌面乾淨點

這兩個Icon在 /usr/share/dist/desktop-files/

linux-wgw3:/home/max # ls -l /usr/share/dist/desktop-files/
total 8
-rw-r--r-- 1 root root 664 Dec 3 17:10 GnomeOnlineHelp.desktop
-rw-r--r-- 1 root root 135 Dec 3 17:10 SuSE.desktop

所以只要把他刪除或是移動就可以有個乾淨的桌面了
linux-wgw3:/home/max # mv /usr/share/dist/desktop-files/* /root/


至於為何會連接到這兩個Icon 找時間再找資料

amr 格式於Linux 下的使用

由於Serena 幫我錄製的聲音格式為amr

這個格式之前沒有使用過

後來知道在Windows 底下要使用 Quicktime 來播放

在Linux 底下Banshee 播放 amr 格式是有問題的^^

但是可以用 mplayer 來播放 amr 格式, 但是對於播放的控制是有問題的 ^^

所以就想要把 amr 格式轉成 mp3, 方便在 mp3 player 或是其他地方播放

後來找到一個方便的方法 GUI 介面 來將amr 格式轉檔

Mobile Media Converter

官方網站

http://www.miksoft.net/mobileMediaConverter.htm

相關畫面

實際上來使用的時候, 如果使用 amr 轉 mp3 會出現錯誤訊息

所以我採取的方式是先使用 Mobile Media Convert 轉成 WAV 檔

再使用 lame 指令轉成mp3 格式

方式如下

#lame  -h   file.wav    file.mp3

 

Upgrade opensuse 11.0 to 11.1 use zypper

之前還是使用 opensuse 11.0 也沒有特別想要升級為 11.1
但是今天 firefox 有點小 lag 到(也許真的是系統正在忙 :p )
讓我有想要升級的感覺又跑出來

所以就開始想 要如何升級
之前使用 10.3 利用 DVD 升級沒有遇到任何狀況

所以就想說, 想測試一下 online upgrade

所以就參考 這篇
http://en.opensuse.org/11.1/Online_upgrade

當然怕死的我, 還是先備份完之後才測試


接下來就開始線上升級啦,

1.先列出有使用的套件庫

#zypper lr -u

2.利用zypper 指令刪除 11.0 的套件庫 ]
(zypper sd 1 <---數字的1 為套件庫編號, 有幾個套件庫就刪掉幾個吧,全部刪除)
#zypper sd 1

3.加入 11.1 的套件庫(我使用的是台灣 ftp.twaren.net 速度快多了), 並命名為 main_repository_oss
#zypper ar http://ftp.twaren.net/Linux/OpenSuSE/distribution/11.1/repo/oss/  main_repository_oss

4.重新更新套件庫
#zypper ref

5.更新zypper
#zypper in zypper

6.更新系統

#zypper dup


更新的狀況一切順利, 考慮把這個做成 script 以後方便升級^^
現在用的就是opensuse 11.1
感覺有順一些 ~~ 不知道是不是心理作用
^^

更新完再加入 一些社群的套件庫 及 non-oss 還有update 套件庫就好^^

opensuse 11.0 更新小記

最近更新opensuse 11.0 常常出現錯誤
原因為 ftp.twaren.net 的 FTP
最近感覺不是很穩
所以將套件的儲存庫 由ftp 方式改為 http方式
就發現順很多, 一次更新500多MB ~~~ Orz.