Báo cáo nhập môn CNTT Đại học Bách Khoa Hà Nội

TRƯỜNG ĐẠI HỌC BÁCH KHOA HÀ NỘI VIỆN CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG ———————— * ———————— BÁO CÁO MÔN HỌC NHẬP MÔN CÔNG NGHỆ THÔNG TIN Nhóm sinh viên thực hiện: Tạ Hữu Công - CNTT2.04 - 20130458 Phạm Thế Hào - CNTT1.01 - 20131205 Lê Thị Anh Phương - CNTT2.04 - 20133018 Vũ Xuân Trường - CNTT2.04 - 20134239 Giáo viên hướng dẫn: Trần Hoàng Hải Trần Thị Thúy Nguyễn Thanh Hùng HÀ NỘI - Ngày 20 tháng 12 năm 2014 Lời cảm ơn Chúng em xin chân thành cảm ơn thầy Trần Hoàng Hải, cô Lê Thị Thúy và thầy Nguyễn Thanh Hùng đã cung cấp cho chúng em những kiến thức rất bổ ích và thực tiễn khi chúng em bắt đầu tìm hiểu về Công nghệ Thông tin cũng như đã giúp đỡ chúng em rất nhiều trong quá trình viết bản báo cáo này. 1 Lời nói đầu Chúng em là những sinh viên năm hai mới bắt đầu làm quen với ngành Công nghệ thông tin. Đây là một ngành khoa học có tốc độ phát triển rất nhanh, thay đổi từng ngày từng giờ, do đó chúng em cần có một nền tảng kiến thức thật vững chắc, cùng phương pháp nghiên cứu hợp lý mới có thể theo kịp những bước tiến của ngành. Dưới sự hướng dẫn của các thầy cô giảng dạy môn “Nhập môn Công nghệ Thông tin” chúng em đã có cơ hội tìm hiểu những kiến thức cơ bản nhất về Scilab, L A T E X , Web. Đây là những công cụ hữu ích để sinh viên Công nghệ thông tin chúng em có thể tiếp tục nâng cao trình độ và tiếp thu kiến thức mới. 2 Tóm tắt nội dung Trong bản báo cáo này, chúng em trình bày những kiến thức cơ bản nhất về Scilab, L A T E X và Web (gồm HTML, CSS và JavaScript) 1. Web: • Các khái niệm cơ bản về WWW • Khái niệm cơ bản về (X)HTML, CSS, JavaScript • Một vài vấn đề trong thiết kế Web 2. L A T E X : • Cách cài đặt và chạy một số engine (MiKTeX, Texlive) và front-end (như Texmaker, TeXnicCenter) trên Windows cũng như Linux • Cấu trúc một tập tin mã nguồn • Một số lệnh đơn giản 3. Scilab : • Cách cài đặt và chạy phần mềm Scilab trên Windows cũng như Linux • Các kiểu dữ liệu và toán tử cơ bản của Scilab • Xử lý ma trận trong Scilab • Cách vẽ đồ thị trong Scilab 3 Mục lục 1 HTML, CSS, JavaScript 8 1.1 Một số khái niệm cơ bản về WWW . . . . . . . . . . . . . . . . . 8 1.1.1 Khái niệm về siêu văn bản . . . . . . . . . . . . . . . . . . 8 1.1.2 Các thành phần của Web . . . . . . . . . . . . . . . . . . . 8 1.2 Một số công cụ thường dùng để tạo trang HTML, CSS, JavaScript 9 1.3 HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10 1.3.1 Giới thiệu về HTML . . . . . . . . . . . . . . . . . . . . . . 10 1.3.2 Làm quen với việc viết code HTML . . . . . . . . . . . . . 11 1.3.3 Thẻ HTML – HTML Tag . . . . . . . . . . . . . . . . . . . 13 1.3.4 Các thẻ HTML cấu trúc . . . . . . . . . . . . . . . . . . . 14 1.3.5 Các thẻ định dạng văn bản (Text) . . . . . . . . . . . . . . 15 1.3.6 Các ký tự đặc biệt trong HTML . . . . . . . . . . . . . . . 16 1.3.7 Các thẻ định dạng danh sách (list) . . . . . . . . . . . . . . 17 1.3.8 Hình ảnh trong HTML . . . . . . . . . . . . . . . . . . . . 18 1.3.9 Thẻ tạo bảng . . . . . . . . . . . . . . . . . . . . . . . . . 19 1.3.10 HTML Frames . . . . . . . . . . . . . . . . . . . . . . . . . 21 1.3.11 Thẻ Frame . . . . . . . . . . . . . . . . . . . . . . . . . . . 22 1.3.12 HTML form và trường nhập liệu. . . . . . . . . . . . . . . . 22 1.3.13 Backgrounds . . . . . . . . . . . . . . . . . . . . . . . . . . 24 1.4 CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25 1.4.1 CSS là gì? . . . . . . . . . . . . . . . . . . . . . . . . . . . 25 1.4.2 Thứ tự xếp lớp . . . . . . . . . . . . . . . . . . . . . . . . . 25 1.4.3 Cú pháp CSS . . . . . . . . . . . . . . . . . . . . . . . . . 25 1.4.4 Nhóm các phần tử với nhau (Grouping) . . . . . . . . . . . 26 1.4.5 Bộ chọn Lớp(The class Selector) . . . . . . . . . . . . . . . 27 1.4.6 Bộ chọn Mã (The id Selector) . . . . . . . . . . . . . . . . 28 1.4.7 Lời chú thích trong CSS . . . . . . . . . . . . . . . . . . . . 28 1.4.8 Làm thế nào để chèn một Style Sheet . . . . . . . . . . . . 29 1.4.9 Các thuộc tính Border trong CSS . . . . . . . . . . . . . . 30 1.4.10 Thuộc tính Font trong CSS . . . . . . . . . . . . . . . . . . 31 1.4.11 Thuộc tính List trong CSS . . . . . . . . . . . . . . . . . . 32 1.4.12 Thuộc tính Text trong CSS . . . . . . . . . . . . . . . . . . 32 1.4.13 Thuộc tính Padding . . . . . . . . . . . . . . . . . . . . . . 32 1.4.14 Các thuộc tính Background trong CSS . . . . . . . . . . . . 33 1.4.15 Thuộc tính Margin trong CSS . . . . . . . . . . . . . . . . 33 1.5 JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34 1.5.1 JavaScript là gì? . . . . . . . . . . . . . . . . . . . . . . . . 34 1.5.2 Các thành phần tạo nên JavaScript . . . . . . . . . . . . . 34 4 1.5.3 Một vài ứng dụng . . . . . . . . . . . . . . . . . . . . . . . 34 1.6 Một số vấn đề về thiết kế Web . . . . . . . . . . . . . . . . . . . . 35 1.6.1 Nên dùng CSS thay cho bảng, nhất là đối với cả trang web . 35 1.6.2 Với các đoạn JavaScript, CSS lớn, dùng cho toàn bộ website nên đặt ở file ngoài . . . . . . . . . . . . . . . . . . . . . . 35 2 L A T E X 36 2.1 Những kiến thức cơ bản về L A T E X . . . . . . . . . . . . . . . . . . 36 2.1.1 T E X . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36 2.1.2 L A T E X . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36 2.1.3 Những điểm mạnh và điểm yếu của L A T E X . . . . . . . . . 37 2.1.4 Một số engine và front-end dùng để soạn thảo . . . . . . . . 37 2.1.5 Cài đặt và sử dụng L A T E X . . . . . . . . . . . . . . . . . . 39 2.2 Cấu trúc của tập tin nhập liệu . . . . . . . . . . . . . . . . . . . . 40 2.3 Cách trình bày một tài liệu . . . . . . . . . . . . . . . . . . . . . . 41 2.3.1 Các lớp tài liệu . . . . . . . . . . . . . . . . . . . . . . . . 41 2.3.2 Các gói . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41 2.3.3 Các định dạng trang của trang văn bản . . . . . . . . . . . 42 2.4 Soạn thảo văn bản . . . . . . . . . . . . . . . . . . . . . . . . . . 42 2.4.1 Định dạng việc xuống hàng và sang trang . . . . . . . . . . 42 2.4.2 Các chuỗi kí tự sẵn có trong L A T E X . . . . . . . . . . . . . 44 2.4.3 Tựa đề, các chương và các mục . . . . . . . . . . . . . . . . 44 2.4.4 Canh trái , canh phải, và canh giữa . . . . . . . . . . . . . 45 2.4.5 Môi trường bảng . . . . . . . . . . . . . . . . . . . . . . . . 46 2.4.6 Một số kí tự đặc biệt . . . . . . . . . . . . . . . . . . . . . 46 2.4.7 Thay đổi kích thước chữ. . . . . . . . . . . . . . . . . . . . 47 3 Scilab 48 3.1 Tổng quan về Scilab . . . . . . . . . . . . . . . . . . . . . . . . . . 48 3.1.1 Giới thiệu Scilab . . . . . . . . . . . . . . . . . . . . . . . . 48 3.1.2 Phương thức tương tác với Scilab . . . . . . . . . . . . . . . 49 3.1.3 Sử dụng help trong Scilab (Hình 3.3) . . . . . . . . . . . . . 50 3.2 Ứng dụng của Scilab trong việc giải toán . . . . . . . . . . . . . . 51 3.2.1 Các loại biến trong Scilab . . . . . . . . . . . . . . . . . . . 51 3.2.2 Tính toán với ma trận và vector . . . . . . . . . . . . . . . 51 3.2.3 Đồ thị . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54 3.2.4 Đồ thị cho dưới dạng hàm . . . . . . . . . . . . . . . . . . 54 5 Danh sách hình vẽ 1.1 Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9 1.2 Notepad++ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9 1.3 Gedit . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10 1.4 Notepad . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11 1.5 Lưu trữ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12 1.6 Mở bằng trình duyệt . . . . . . . . . . . . . . . . . . . . . . . . . 12 1.7 Trang html đầu tiên . . . . . . . . . . . . . . . . . . . . . . . . . . 13 1.8 Thẻ HTML cấu trúc . . . . . . . . . . . . . . . . . . . . . . . . . . 14 2.1 Texmaker . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38 2.2 TeXnicCenter . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38 2.3 Cài đặt MiKTeX . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39 2.4 Cài đặt MiKTeX: Tiếng Việt . . . . . . . . . . . . . . . . . . . . . 40 3.1 In chuỗi . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49 3.2 Editor . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49 3.3 Help . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51 6 Giới thiệu Chúng em nhận thấy các vấn đề này là cơ bản và hết sức quan trọng để có thể tiếp tục học tập và nghiên cứu chuyên sâu về Công nghệ Thông tin. Cụ thể: • Scilab: Đây là một phần mềm miễn phí và mạnh mẽ để giúp giải một số bài liên quan đến Toán học và Vật lý. • L A T E X : Đây là công cụ giúp chúng em có thể viết các bản báo cáo với chất lượng tốt nhất khi học tập, nghiên cứu các vấn đề chuyên môn. • Web: Đây là những kiến thức cơ bản nhất để chúng em có thể tự thiết kế một trang web cá nhân hay hơn nữa, đó là một trang Web cho tập thể, cho cộng đồng. 7 Chương 1 HTML, CSS, JavaScript HTML là ngôn ngữ cơ bản nhất của tất cả các website. Kể cả những trang web động được viết bằng PHP nhưng trong nó vẫn có code HTML. Do vậy dù cho có thể sở hữu trong tay những chương trình làm web WYSIWYG hàng đầu như: Frontpage và Dreamweaver, nhưng điều đó vẫn chưa phải là đầy đủ nếu không biết chút gì về HTML. 1.1 Một số khái niệm cơ bản về WWW 1.1.1 Khái niệm về siêu văn bản Hypertext là văn bản (text) trên máy tính có sự liên kết đến một văn bản khác và có thể truy cập trực tiếp thông qua click chuột, nhấn phím. Hyperlink là một liên kết từ một file hypertext đến một file khác. Hypermedia là sự mở rộng của hypertext, trong đó đối tượng có thể là văn bản, đồ họa, âm thanh, video. . . 1.1.2 Các thành phần của Web • Web là hệ thống các tài liệu hypertext liên kết với nhau thông qua mạng Internet • Các thành phần của Web – WebPage: là một trang Web. – Website: Là tập hợp các WebPage có nội dung thống nhất. – Uniform Resource Locator: dùng để định vị tài nguyên trên Internet theo cách thuận tiện cho người sử dụng (thay cho địa chỉ IP không mang ý nghĩa và khó nhớ). • Cấu trúc: giao thức://địa chỉ máy:cổng/đường dẫn đến tài nguyên – Web Server: cung cấp tài nguyên cho máy khác. – Web Browser: dùng để khai thác dàch vụ Web. 8 1.2 Một số công cụ thường dùng để tạo trang HTML, CSS, JavaScript 1. Dreamweaver: Là công cụ có phí, mạnh, dễ sử dụng. (Hình 1.1) Hình 1.1: Dreamweaver 2. Notepad++: Là công cụ miễn phí, nguồn mở tuy nhiên không mạnh bằng Dremweaver, chỉ có tính năng highlight và auto-completion tuy nhiên khá hạn chế.(Hình 1.2) Link:http://notepad-plus-plus.org/ Hình 1.2: Notepad++ 9 [...]... và trường nhập liệu HTML form được sử dụng để chọn những dữ liệu nhập vào khác nhau của người dùng Form Một form là một vùng mà nó bao gồm những thành phần của form Thành phần của form là những thành phần cho phép người dùng có thể điền thông tin như là trường chữ, menu thả xuống, nút radio, và các hộp kiểm vào một form Một form được xác định bởi thẻ Nhập liệu... nhận được Ta có bảng sau: 23 Tag 1.3.13 Mô Tả Kiểu form để nhập thông tin Một ô nhập liệu Vùng nhập liệu có nhiều hàng Nhãn Nhóm các vùng nhập với nhau nhãn của 1 fieldset Danh sách chọn nhóm các phần tử trong danh sách chọn 1 phần tử trong danh sách chọn Nút bấm Hết hỗ trợ Dùng thay thế Backgrounds... background-image: url("images/back40.gif") } 29 Style Nội tuyến(Inline Styles) Một Style nội tuyến mất rất nhiều ưu điểm của các Style Sheet bình thường bởi việc trộn lẫn nội dung với việc thể hiện Sử dụng phương pháp tiết kiệm này, giống như khi một style được áp dụng cho một sự kiện riêng lẻ của một thành phần Để sử dụng các Style nội tuyến bạn sử dụng thuộc tính style trong thẻ có liên quan... nhất: 1 Theo mặc định của trình duyệt 2 Style Sheet bên ngoài 3 Style Sheet bên trong.(bên trong cặp thẻ ) 4 Style nội tuyến.(bên trong các thành phần HTML) Vì thế một Style nội tuyến có quyền ưu tiên là cao nhất, điều đó có nghĩa là nó sẽ trùm lên tất cả các style được khai báo bên trong thẻ , trong một Style Sheet bên ngoài và giá trị mặc định của Browser 1.4.3 Cú pháp CSS Cú pháp của... HTML Tag - Được dùng để đánh dấu các thành phần HTML Được bao bởi 2 ký tự < và > - Thường đi theo cặp: thẻ mở và thẻ đóng - Phần đặt giữa thẻ mở và đóng là nội dung của thành phần HTML - Các thẻ HTML không phân biệt chữ hoa chữ thường - Các thẻ có thể có thuộc tính – attribute - Thuộc tính của thẻ quy định thêm những thông tin tiết cho việc hiển thị thành phần HTML - Các thuộc tính luôn... có nội dung thì không được hiển thị tốt lắm ở hầu hết các trình duyệt row 1, cell 1 row 1, cell 2 row 2, cell 1 Nó sẽ có dạng thế này trên trình duyệt row 1, cell 1 row 1, cell 2 row 2, cell 1 Tag 1.3.10 Mô Tả Vẽ bảng hàng đầu của bảng hàng... 2 row 2, cell 1 Tag 1.3.10 Mô Tả Vẽ bảng hàng đầu của bảng hàng trong bảng ô trong hàng nhãn của bảng nhóm các cột Định các thuộc tính của cột Hàng Đầu bảng Thân của bảng Hàng cuối bảng HTML Frames Với frame bạn có thể hiển thị nhiều trang web trên cùng một cửa sổ trình duyệt Mỗi một tài liệu HTML được gọi là một frame, và mỗi... Người làm web phải theo dõi nhiều tài liệu HTML • Khó có thể in ấn toàn bộ trang web Thẻ frameset Thẻ xác định bạn sẽ chia cửa sổ trình duyệt thành những frame như thế nào Môi một frame xác định một tập hợp các hàng hoặc cột Giá trị của hàng hoặc cột chỉ ra diện tích của màn hình mà frame đó sẽ chiếm 21 1.3.11 Thẻ Frame Thẻ xác định tài liệu HTML nào sẽ được chèn vào mỗi frame Ở ví... đánh dấu siêu văn bản - Ngôn ngữ đánh dấu là dãy các thành phần được phân cách nhau bởi các ký tự đặc biệt xác định cách hiển thị văn bản hay các mục khác trong thành phần đó - Trong HTML, các ký tự đặc biệt đó là các thẻ HTML – HTML tag - File HTML là file văn bản (text) chứa các thẻ định dạng HTML quy định cho trình duyệt biết cách hiển thị các thành phần của trang Web - File HTML có phần mở rộng là... Thuộc tính hoạt động cùa form và nút Submit Khi người dùng nhấp chuột vào nút "submit", nội dung của form đó sẽ được gửi đến một tệp tin khác Thuộct ính hoạt động của form xác định tên của file mà nó sẽ gửi nội dung đến Tệp tin đó được xác định trong thuộc tính hoạt động của form và thường thì nó sẽ có những hành động với dữ liệu nó nhận được