Tài liệu Toán: tháng 7 2014

Thứ Ba, 8 tháng 7, 2014

Thủ thuật blogspot

Nhằm giúp các blogger mới vào nghề hiểu thêm về code nên hôm nay mình chia sẻ lại một số code thông dụng thường gặp trong quá trình viết bài cũng như thiết kế blog. Hy vọng sẽ giúp ích được cho các bạn.

1. Font, màu chữ, thụt vào đầu dòng (Dùng dòng 1 hay 2 đều như nhau)

<span style="color:#339966; font:12pt Tahoma; margin-left:12px;">Nội_dung</span>
<span style="color:#339966; font-family:Tahoma; font-size:12pt; margin-left:12px;">Nội_dung</span>

#339966 // Mã màu cho chữ
12pt Tahoma // Cỡ chữ và font chữ

margin-left:12px // Số pixel (khoảng cách) chữ thụt vào đầu dòng. Có thể thay left bằng right cho chiều ngược lại.

2. Canh giữa, canh phải

<div style="text-align:center;">Nội_dung</div>

center // Thay center = right cho canh phải hoặc = left cho căn trái

3. Định dạng chữ: Đậm, Nghiêng, Gạch chân, Gạch ngang chữ

<b>Nội_dung_in_đậm</b>
<i>Nội_dung_in_nghiêng</i>
<u>Nội_dung_gạch_chân</u>
<strike>~~Nội_dung_chữ_bị_gạch_ngang~~</strike>

4. Dấu chấm vô dòng con, đánh số đầu dòng

Dấu chấm vô dòng con
<ul>
<li> Nội_dung 1 </li>
<li> Nội_dung 2 </li>
<li> Nội_dung 3 </li>
</ul>

Đánh số đầu dòng
<ol>
<li> Nội_dung 1 </li>
<li> Nội_dung 2 </li>
<li> Nội_dung 3 </li>
</ol>

5. Bookmark đến một vị trí nhanh trong bài viết

<a href="LINK_bài_viết#Tên_gán_cho_vị_trí ">Nội_dung</a>
<a name="Tên_gán_cho_vị_trí ">Nội_dung</a>

Lưu ý:
    Tên cách nhau không được dùng khoảng trắng mà phải dùng shift gạch. (VD: nhà_xinh)
    Tốt nhất không nên dùng chữ có dấu cho tên gán.

Ví dụ:
    - Đến điểm A (<a href="LINK_bài_viết_cụ thể#Diem_A">Đến điểm A</a>)
    - ...
    - Điểm A (<a name="Diem_A">Điểm A</a>)
Code trong ngoặc là chú thích cho ví dụ.
Như vậy khi ta click chuột vào "Đến điểm A" thì lập tức lệnh sẽ đưa ta nhảy đến vị trí "Điểm A".

6. Chèn Flash vào bài viết (Chọn loại 1 hay 2 đều được)

1.
<div style="text-align:center;"><embed wmode=Transparent pluginspage="http://www.macromedia.com/go/getflashplayer" src="LINK_FLASH" width="900" height="300"
type="application/x-shockwave-flash" scale="" play="true" loop="true"
menu="true"></embed></div>

2.
<embed src="LINK_FLASH" bgcolor="#000000" type="application/x-shockwave-flash" allowscriptaccess="none" width="400" height="400"></embed>

7. Chèn hình ảnh (image) vào bài viết

1. Code đơn giản
<img src="LINK_ẢNH" title="Ghi_chú" alt="Mô_tả"/>

2. Code mở rộng
<img src="LINK_ẢNH" title="Ghi_chú" alt="Mô_tả" align="bottom" width="400" height="400"/>

    Ghi_chú // Khi rê chuột lên ảnh, sẽ hiện chú thích.
    Mô_tả // Khi rê chuột lên ảnh, sẽ hiện chú thích.
    Sử dụng hai lệnh này thì khi người dùng truy cập blog chọn không hiển thị ảnh thì sẽ hiện dòng chữ này thay cho ảnh đó.
    align="bottom" // Vị trí ảnh so với chữ. Có thể đổi thành middle(giữa) - top(trên) - bottom(dưới). Không dùng, để mặc định theo blog chọn sẵn thì xóa nó đi.

8. Chèn link liên kết vào bài viết

<a href="LINK" target="blank">Tên_Link</a>

target="blank" // Mở link liên kết trong một trang mới. Bỏ lệnh này thì trang mới sẽ được mở ngay tại trang đang dùng (nghĩa là trang đang dùng sẽ bị load qua trang link ta vừa click vào). Nếu người dùng có thói quen "Open new tab" thì lệnh này có hay không cũng không khác biệt.

Ví dụ:
- Dùng target="blank" - XEM
- Không dùng target="blank" - XEM

9. Chèn ảnh chứa link

<a href="LINK" target="blank"><img src="LINK_ẢNH"/></a>

10. Tạo button ẩn hiện nội dung

<div>
<div>
<input type="button" value="Xem" style="width:75px; font-size:11px; margin:0px; padding:4px; border="1"" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Ẩn'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Xem'; }">
</div>
<div>
<div style="display: none;  border:#4F4F4F 1px solid; padding: 4px; background:# ">

NỘI_DUNG 
</div>
</div>
</div>

Ví dụ:

11. Chèn nhạc vào bài viết

<object name='hat' width=300 height=45>
<embed  type='application/x-mplayer2' 
 pluginspage='http://www.microsoft.com/Windows/Downloads/Contents/Products/MediaPlayer/'  
 controls='controlpanel' width=300 height=45 src='LINK_NHẠC' 
 autostart="0" showstatusbar="0" ShowControls='true' loop='0' name='hat'></embed></object>

    LINK_NHẠC // Phải là link trực tiếp (VD: http://...bài_hát.mp3)
    loop='0' // Không lặp lại
    loop='1' // Lặp lại một lần
    loop='-1' // Lặp lại mãi mãi
    autostart="0" // Không tự play
    autostart="1" // Play ngay khi web tải xong

12. Chia 2 cột, 3 cột, 4 cột

<table><tbody>
<tr><td class="column_1" style="font:12px Tahoma; color:#000000; width:120px;padding:4px;" valign="top"><div class="column_1">

Nội_dung_cột_1
</div>
</td><td class="column_2" style="font:12px Tahoma; color:#000000;width:120px;padding:4px;" valign="top"><div class="column_2">

Nội_dung_cột_2
</div>
</td></tr>
</tbody></table>

Thêm cột thì thêm trên dòng </td></tr> đoạn code:

</td><td class="column_n" style="font:12px Tahoma; color:#000000;width:120px;padding:4px;" valign="top"><div class="column_n">

Nội_dung_cột_n
</div>

13. Viền khung một nội dung trong bài viết

<div style="border:#4F4F4F 1px solid; padding: 4px; background:#eee; width:400px;">
NỘI_DUNG 
</div>

    #4F4F4F 1px solid // Lần lượt là: Mã màu - Độ dày đường viền - Loại đường viền.
       - solid ______________
       - dashed ----------------
       - dotted ......................
    background:#eee // Nền khung
    width:400px // Bề rộng khung. Mặc định là sẽ rộng bằng khung bài viết (nếu bỏ lệnh này đi)

14. Chèn khung chứa code có thẻ "Select all" (Không cần mã hóa code)

<form name="MyTextBoxForm"><input name="button" onclick="javascript:this.form.MyTextBox.focus();this.form.MyTextBox.select();" type="button" value="Select all"/>
<textarea cols="59" name="MyTextBox" rows="18" wrap="on" style="background:#eee; color:#464646; border:1px #A0C4EA dashed;">NỘI_DUNG_CODE</textarea> </form>

    cols="59" // Bề rộng khung chứa code
    rows="18" // Số dòng trong khung chứa code
    wrap="on" // Trong một dòng, chữ dài quá khung sẽ hiện thanh trượt kéo ngang qua
    wrap="off" // Nhiều dòng chữ quá số dòng khung quy định sẽ hiện thanh trượt kéo xuống

Ví dụ:

15. Ảnh rõ hơn khi rê chuột vào

1. Ảnh có chứa link

<a href="link_liên_kết" target="blank">
<img
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.6;this.filters.alpha.opacity=60" style="opacity:0.6;filter:alpha(opacity=60)" src="LINK_HÌNH"/>
</a>

2. Ảnh không chứa link

<img
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.6;this.filters.alpha.opacity=60" style="opacity:0.6;filter:alpha(opacity=60)" src="LINK_HÌNH"/>

opacity=0.6 và opacity=60 // Ảnh mờ trước khi rê chuột vào.
Lưu ý: Nếu thay đổi độ mờ thì phải thay đổi cả 4 giá trị.

Ví dụ:

16. Tạo hiệu ứng hiện ảnh khác khi rê chuột vào ảnh

1. Ảnh có chứa link

<a href="link_liên_kết" target="blank"><img onmouseover="this.src='LINK_HÌNH_THAY_THẾ'" onmouseout="this.src='LINK_HÌNH'" src="LINK_HÌNH" ></a>

2. Ảnh không chứa link
<img onmouseover="this.src='LINK_HÌNH_THAY_THẾ'" onmouseout="this.src='LINK_HÌNH'" src="LINK_HÌNH" >Ví dụ:

17. Tạo hiệu ứng khi rê chuột vào link liên kết

<a href="LINK"  target="blank" onmouseover="oldColor=this.style.backgroundColor;this.style.backgroundColor='#eee';" onmouseout="this.style.backgroundColor=oldColor;">TEN_LINK</a>

    LINK // Link liên kết
    #eee // Mã màu khi rê chuột lên
    TEN_LINK // Tên gán cho link liên kết

18. Chèn trang HTML vào bài viết (Chèn trang web vào bài viết)

<iframe src="LINK_HTML" height="550" width="600" scrolling=yes frameborder="0"></iframe>

    scrolling=yes // Cho hiện thanh trượt, ngược lại không dùng thì sữa thành no
    frameborder="0" // Đường viền, 0 là không viền

    Ta có thể dùng lệnh này để chèn bất cứ trang nào dạng HTML (Ví dụ: http://abc.html) vào bài viết đều được hết :)

Ví dụ: Xem tại đây

19. Các loại đường viền | border: 1px #ccc solid;

Dashed - - - - - - - - - - - - - - - - -
Solid _____________________
Dotted ..................................

20. Các kiểu định dạng chữ | text-decoration:none;

none (Không định dạng)
underline (Gạch đích)
overline (Gạch trên đầu)
line-through (Gạch ngang chữ)
blink (Chớp chớp)
inherit

21. Thêm các định dạng link vào class

/*Link cố định*/
a:link { 
color:#3366ff;
text-decoration:none;
}

/*Link đã xem qua*/
a:visited {
color:#ccc;
text-decoration:none;
}

/*Link khi rê chuột vào*/
a:hover {
color:#339966;
text-decoration:underline;
}

22. Tạo bóng đổ và bo tròn 4 góc viền

/*Tạo bóng đổ*/
box-shadow: 8px 8px 8px #616D7E;
-webkit-box-shadow: 8px 8px 8px #616D7E;
-moz-box-shadow: 8px 8px 8px #616D7E;

/*Tạo bóng đổ 4 cạnh*/
box-shadow: 0px 0px 8px #616D7E;
-webkit-box-shadow: 0px 0px 8px #616D7E;
-moz-box-shadow: 0px 0px 8px #616D7E;

/*Bo tròn 4 góc viền*/
border-radius:4px; 

/*Bo tròn tùy chọn: top, right, bottom, left*/
border-radius:4px 4px 4px 4px;

Thay box thành text cho chữ

23. Các loại định dạng list | ... ul {list-style-type:none;}

none: Không hiển thị đánh dấu
disc: Chấm vuông
circle: Chấm tròn trắng
square: Chấm tròn đen
decimal: Kiểu số (1,2,3,4,…)
lower-alpha: Kiểu Alphabet ở dạng in thường (a, b, c, d, e, …)
upper-alpha: Kiểu Alphabet ở dạng in hoa (A, B, C, D, E, …)
lower-roman: Kiểu La Mã ở dạng thường (i, ii, iii, iv, v, …)
upper-roman: Kiểu La Mã ở dạng in hoa (I, II, III, IV, V, …)

/*Link hình thay cho list*/

list-style-image:url('Link_hình');

24. Các vị trí đặt ảnh nền background | background: url(image) repeat ;

repeat: lặp ảnh
repeat-y: lặp ảnh theo chiều dọc (từ trên xuống)
repeat-x: lặp ảnh theo bề ngang (từ trái qua)
no-repeat: không lặp
top: đặt ảnh trên mép cùng
top right: đặt ảnh mép trên cùng góc phải
top left: đặt ảnh mép trên cùng góc trái
bottom: đặt ảnh mép dưới cùng
bottom left: đặt ảnh mép dưới cùng góc trái
bottom right: đặt ảnh mép dưới cùng góc phải
right: đặt ảnh bên mép phải
left: đặt ảnh bên mép trái
center: đặt ảnh ở vị trí giữa

25. Code xem địa chỉ IP, thông tin của máy truy cập blog

(Có thể post vào widget bất kỳ ở trên blog)

<img src="http://www.wieistmeineip.de/ip-address">

26. Cách mã hóa code

Với ký tự < phải đổi thành <
Với ký tự > phải đổi thành >
Với ký tự & phải đổi thành &
Với khoảng trắng phải đổi thành  

Để post các chú thích kí tự trên lên blog được thì:

    < phải đổi thành &lt;
    > phải đổi thành &gt;
    & phải đổi thành &amp;

27. Các lệnh điều kiện <b:if cond= ... </b:if>

1. Điều kiện ở trang chủ

<b:if cond='data:blog.url == data:blog.homepageUrl'>
...
</b:if>

2. Điều kiện ở trang bài viết

<b:if cond='data:blog.pageType == "item"'>
...
</b:if>

3. Điều kiện ở trang chủ, trang nhãn

<b:if cond='data:blog.pageType == "index"'>
...
</b:if>

4. Điều kiện ở các trang lưu trữ

<b:if cond='data:blog.pageType == "archive"'>
...
</b:if>

5. Điều kiện ở các trang tĩnh

<b:if cond='data:blog.pageType == "static_page"'>
...
</b:if>

6. Điều kiện ở một trang riêng biệt nào đó

<b:if cond='data:blog.url == "URL_của_trang_riêng_biệt"'>
...
</b:if>

Nếu thay == thành != thì kết quả sẽ ngược lại - Nghĩa là sẽ loại trừ trang đặt điều kiện ra và lấy phần ngược lại (các trang còn lại)

Ví dụ: Điều kiện loại trừ trang bài viết

<b:if cond='data:blog.pageType != "item"'>
...
</b:if>

28. Thêm chữ ký hay ghi chú dưới mỗi bài viết (Đặt dưới dòng <data:post.body/>)

<b:if cond='data:blog.pageType == "item"'>
Nội_dung
</b:if>

Nội_dung // Ghi chú nội dung của bạn, có thể dùng hình ảnh, màu chữ, canh lề,v.v..

29. Script chèn file .js vào blog

<script src='Link_File_JS' type='text/javascript'/>

30. Script chèn trực tiếp nội dung file .js vào blog

<script type='text/javascript'>
//<![CDATA[

Nội_dung_file_js
//]]>
</script>

31. Thêm nhanh khung hướng dẫn hay nội quy comment

- Tìm đến thẻ <data:blogTeamBlogMessage/>
- Đôi khi có tên là <data:blogCommentMessage/>
- Thêm vào sau nó đoạn code sau:

<!--Khung nội quy comment-->
Nội dung nội quy comment của bạn 
<p></p>

- Sau mỗi hàng phải thêm cặp thẻ <br></br> hoặc <br/> nếu muốn xuống dòng.
- Có thể dùng các code trang trí cho khung như: hình ảnh, màu chữ, v.v..

Ví dụ: Code chèn nội dung hướng dẫn comment giống ở blog mình.

<!--Nội dung hướng dẫn comment-->
<div style='border:#ccc 1px solid; padding:4px;border-radius:4px; background:#eee;'>
Bạn có thể sử dụng một số thẻ HTML như: <br/>
<textarea cols='48' rows='4'>
» Chữ in đậm: <b>Nội_dung_chữ_in_đậm</b>
» Chữ in nghiêng: <i>Nội_dung_chữ_in_nghiêng</i>
» Chèn link liên kết: <a href='Link'>Tên_link</a>
» Chèn hình ảnh: [img]Link_hình[/img] </textarea>
</div>
<p/><p/>

Thứ Hai, 7 tháng 7, 2014

Cài đặt MathJax cho blog toán học

Bài viết này hướng dẫn cho các bạn cách cài đặt MathJax cho blog toán học. Sau khi cài đặt MathJax xong thì các bạn có thể viết các ký hiệu toán trên blog, ví dụ như

$$a^2 + b^2 = c^2$$

sẽ trở thành

a 2 + b 2 = c 2

Các bạn đã có blog chưa? Nếu chưa thì đọc bài viết ở đây để biết cách tạo một blog. Còn nếu bạn đã có blog rồi thì chúng ta bắt đầu nhé.

Vào trang điều hành blog

Truy cập địa chỉ https://www.blogger.com để vào trang điều hành blog

Nhấn vào tên của blog như hình vẽ sau

Sau khi nhấn vào tên của blog, bạn sẽ vào khu trung tâm điều hành blog.

Vào mục Template để cài đặt MathJax

Tại khu trung tâm điều hành blog, nhấn vào nút Template ,
sau đó nhấn nút Edit HTML như hình sau đây

Một cửa sổ chứa mã HTML sẽ hiện ra
Các bạn cần chèn đoạn mã sau đây ngay phía dưới dòng mã <head >

như hình dưới đây

Chèn xong đoạn mã MathJax này, các bạn bấm nút  Save template  để kết thúc

Thử đánh ký hiệu toán

Bây giờ chúng ta đánh thử một bài viết có ký hiệu toán học để kiểm tra xem việc cài đặt MathJax có thành công hay không.

Bấm nút  New post  rồi đánh công thức toán như hình sau
Sau khi các bạn viết xong, nhấn vào nút  Publish  để đăng bài

Truy cập vào địa chỉ blog của mình, các bạn sẽ thấy như hình vẽ sau

Chúc các bạn thành công!

Tự động tạo mã Latex bảng biến thiên của hàm số

Bạn mới làm quen với Latex và nhiều điều còn lạ lẫm lắm. Trong khi đó, bạn có nhu cầu vẽ bảng biến thiên của một hàm số cho tài liệu mà bạn đang soạn thảo. Lúc này bạn thực sự gặp khó khăn vì "vốn liếng" về Latex hãy còn ít. Và bạn có ước rằng có một chương trình nào đó mà khi ta nhập vào một hàm số thì chương trình sẽ tự động tính đạo hàm, xét dấu đạo hàm, tính giới hạn và lập thành bảng biến thiên? Hơn nữa, chương trình ấy có thể cung cấp cho bạn mã Latex của bảng biến thiên đó để bạn chép vào tài liệu mà bạn đang soạn thảo?

Hôm nay lang thang trên internet, tình cờ bắt gặp một chương trình đáp ứng được những tiêu chí mà bạn hằng ao ước. Xin giới thiệu nhanh dưới đây.

Đầu tiên bạn tải về chương trình tại liên kếthttp://sourceforge.net/projects/wxgeometrie/. Bạn cũng có thể tham quan trang chủ của chương trình này tại: http://wxgeo.free.fr/wordpress/. Đây là một chương trình hỗ trợ cho nhiều lĩnh vực toán như: hình học, đại số, thống kê,... nhưng trong phạm vi bài viết này chỉ giới thiệu chức năng tự động tạo bảng biên cho một hàm số bất kỳ.

Sau khi tải về, bạn giải nén tập tin tải về sẽ được thư mục WxGeometrie và bên trong nó có các thư mục con và biểu tượng như trong hình sau.

Tiếp đến, bạn nhấn vào biểu tượng wxgeometrie để chạy chương trình.

Để sử dụng chức năng tạo bảng biến thiên, bạn vào Outils --> Options --> Modules và đánh dấu chọn vào mục Tableaux Latex rồi nhấp Ok để đồng ý.

$chọn Tableaux Latex$

Bây giờ ta thử lập bảng biến thiên cho hàm số $y=x^3-3x+5$ bằng cách vào Tableaux Latex và nhập hàm số vào ô trống có con trỏ đang nhấp nháy rồi nhấn vào Ok và đợi kết quả.

$copy đoạn mã Latex$

Copy đoạn mã Latex được sinh ra ở vùng trống bên dưới rồi chép vào tập tin .tex

$Chép vào file tex$

Biên dịch ta thu được kết quả

Chúc bạn thành công và khám phá thêm nhiều điều thú vị.

Truy tìm ngược từ file pdf sang file tex đối với VieTex

Khi soạn thảo và biên dịch tài liệu từ file tex sang file pdf xong, bạn đọc lại thấy trong tài liệu có vài lỗi chính tả, bạn thấy bố cục chưa hợp lý bạn muốn đổi section thành subsection, bạn có ý tưởng chèn thêm nội dung B vào trước nội dung A,... Lúc đó bạn phải lục tung file tex để dò tìm lỗi chính tả, bạn phải theo dõi section cần đổi thành subsection ở chỗ nào, bạn phải xác định vị trí tương ứng để thêm nội dung B vào trước nội dung A,... Nếu file tex của bạn có nội dung "dài dằng dặc" thì bạn sẽ phải vất vả lắm đây. Bạn ước gì có thể double click chuột vào chỗ muốn chỉnh sửa trên file pdf thì nó nhảy đến vị trí tương ứng trong file tex. Điều bạn mơ ước đã được SumatraPDF đáp ứng. Thật vậy, tôi trình bày chi tiết cách cài đặt dưới đây đối với chương trình soạn thảo VieTex, bạn làm theo và sẽ mỉm cười hài lòng thôi.

Đầu tiên bạn tải về bộ cài đặt SumatraPDF (installer) tại link:http://blog.kowalczyk.info/software/sumatrapdf/downloadafter.html và tiến hành cài đặt bình thường như những chương trình khác.

Tiếp đến bạn mở VieTex --> Options --> Configuration --> Set Program chọn Sumatra view pdf và thay dòng lệnh

-reuse-instance -inverse-search "C:\vietex\vietex.exe\" %f -line:%l"

trong ô Paramaters thành

-reuse-instance -inverse-search "C:\vietex\vietex.exe \"%f\" -line:%l"

Bạn nhấn vào Apply và Ok để thực hiện sự thay đổi.

Bây giờ bạn biên dịch file tex thành file pdf, bạn đọc file pdf bằng chương trình SumatraPDF và double clicks vào một vị trí nào đó trên nội dung trong file pdf để cảm nhận sự tuyệt vời,

. Chúc bạn thành công.

Cảm ơn thầy Nguyễn Hữu Điển đã giải đáp tận tình. http://nhdien.wordpress.com

Thứ Bảy, 5 tháng 7, 2014

Chuyên đề Tích phân

Download Chuyên đề Tích phân

Chuyên đề thể tích khối đa diện - Luyện thi đại học

Chuyên đề Khảo sát hàm số - Luyện thi đại học

Thứ Sáu, 4 tháng 7, 2014

Viết văn bản toán học PDF trực tuyến

Bài viết này hướng dẫn các bạn cách soạn thảo văn bản toán học PDF trực tuyến bằng LaTeX.

Soạn thảo văn bản trực tuyến có những ưu điểm và thuận lợi sau: