PC [EPUB, CSS] Các mẩu Css và Saved Search

Thảo luận trong 'Hướng dẫn chung' bắt đầu bởi tran ngoc anh, 19/8/21.

  1. machine

    machine Lớp 11

    Đã cài đặt app Moon Reader bản miễn phí mới nhất từ Google Play, Moon Reader vẫn không hiển thị được gạch đầu dòng như cách của bạn @tran ngoc anh trong gach-dau-dong.epub
    Nó hiển thị như vầy, mất gạch đầu dòng luôn
    gachdaudong.png

    Cụ vinaguy dùng bản nào Moon Reader nào vậy?
    Vẫn file gach-dau-dong.epub Reasily hiển thị bình thường (có đầy đủ dấu gạch đầu dòng).
     

    Các file đính kèm:

  2. tran ngoc anh

    tran ngoc anh Cử nhân

    Moon hiện thị trật khối thứ khác. Vừa test một file đã thấy nhiều vấn đề như trái núi :D
     
    machine thích bài này.
  3. vinaguy

    vinaguy Lớp 11

    Oop! Sorry bác. Hôm trước em chách trên cuốn Kim Dung nhưng em quên mất: Em cũng phải fake nó một chút thì nó mới hiển thị bác ạ. Sorry em quên nên làm bác mất thời gian.
    Tiện đây em liệt kê các thứ mà Moon không hiển thị hoặc hiển thị kém để các bác tham khảo:
    Dạng list: Nó hiển thị được: Dạng chấm tròn rỗng, dạng chấm tròn đặc, dạng ô vuông, dạng số 1,2,3. Còn nhiêu nữa là nó ngẩn tò te ra, không biết gì luôn. Nhưng nếu mình fake nó một chút thì nó vẫn hiển thị được.
    Ngoài ra, nếu các bác mở css trên cali ra, chỗ lệnh nào có màu hồng thì nó sẽ không hiển thị trên nhiều app khác nhau chứ không riêng gì Moon nữa nhé.
     
    machine and tran ngoc anh like this.
  4. machine

    machine Lớp 11

    Mặc dù vậy, vẫn iêu Moon :P
     
  5. tran ngoc anh

    tran ngoc anh Cử nhân

    Mình dùng Moon trước cả các app mình dùng hiện tại, dùng một thời gian dài luôn, cả năm trời luôn ấy.
     
  6. RGBCD

    RGBCD Lớp 3

    Đã tìm ra lý do Kindle không hiển thị trang dùng thuộc tính position: absolute; rồi. Nó chỉ chấp nhận 1 thẻ div có thuộc tính đó thôi. Hồi trước tôi dùng 3 thẻ div để định dạng cho 3 vị trí: đỉnh, giữa và dưới cùng. Sửa thành như sau thì được, định dạng mỗi dưới cùng thôi. Vì thông thường trang hiển thị với số lượng chữ ít sẽ trống ở dưới.

    Với kết cấu và css như thế này thì khi zoom lên chữ sẽ không tràn sang trang khác, nếu zoom không quá lớn (thực tế không ai lại để chữ hiển thị quá to nên khả năng này không xảy ra).

    Nội dung dùng position: absolute; ở <div class="bia3"> nhé:
    css (dùng position: absolute; ở chỗ tô đậm đỏ nhé):

    Hiển thị trên Kindle khi zoom lên:
    screenshot_2021_09_28T13_23_23+0659.png
     

    Các file đính kèm:

    Chỉnh sửa cuối: 28/9/21
  7. Phiêu Lãng Du

    Phiêu Lãng Du Mầm non

    Cảm ơn bạn nha. Để mình thử cái này, lúc trước mình cũng xài 3 position: absolute; và trang đó bị mất trên kindle.
     
  8. RGBCD

    RGBCD Lớp 3

    Tôi quên chưa thử 2 position, bạn test luôn nhé, css trên của tôi cũng thiếu một dòng text-indent: 0; ở các thuộc tính, màn hình nhỏ thì cần tận dụng hết bề ngang.
     
    Phiêu Lãng Du thích bài này.
  9. vinaguy

    vinaguy Lớp 11

    Bác lấy cái gì để mở kindle ra mà edit thế? Hỏi thế thôi, chứ em cũng không dùng prc bao giờ.

    Các bác cho em hỏi ngu tí. Chúng ta có nên bàn về css online tí không nhỉ?
     
  10. RGBCD

    RGBCD Lớp 3

    Máy đọc sách Kindle PW4 mở file azw3, cái file cũng đính kèm cùng epub đó. File prc và mobi không có tính năng thẻ với css. Bạn suy nghĩ cực đoan nhỉ? :D
     
    Chỉnh sửa cuối: 29/9/21
  11. RGBCD

    RGBCD Lớp 3

    Đọc bằng Kindle thì không bao giờ nên đọc prc vì nó không có mục lục ẩn, cũng không có chú thích popup. Tối thiểu phải là mobi: hiển thị đơn giản nhưng có chú thích popup, mục lục ẩn, cao cấp hơn thì dùng azw3: tính năng tương tự epub: có thể hiển thị font nhúng, và chỉnh sửa cũng thế.

    Bạn @vinaguy chưa dùng Kindle bao giờ à?

    Ưu điểm của nó là lâu hết pin, độ 2 tuần mới phải sạc, dùng công nghệ mực điện tử nên trông như sách giấy bình thường, môi trường càng sáng thì càng nét, đỡ hại mắt, tỷ lệ cạnh màn hình là chữ nhật chuẩn như trang sách thường, không như đt màn hình dài ngoằng.

    upload_2021-9-29_11-43-23.png
     
    Chỉnh sửa cuối: 29/9/21
  12. RGBCD

    RGBCD Lớp 3

    Hình như bạn @vinaguy vẫn hiểu sai ý tôi ở topic kia khi tôi nhắc đến prc. Với tôi prc là nguồn text (tựa như sách giấy, pdf, word, txt...) khi muốn định dạng lại ebook theo ý muốn chứ không phải tôi thích file prc. Để định dạng lại thì có thể convert thẳng sang azw3 cũng được, vì azw3 cũng giống epub: cũng có html, css như vậy. Nhưng vì tôi dùng cả 2 thiết bị đọc sách đt và Kindle nên chọn cách convert sang epub rồi khi xong thì convert sang mobi hoặc azw3 khi muốn dùng Kindle. Cũng phải giải thích tại sao vẫn dùng mobi khi không có nhiều tính năng như azw3? Bởi vì có thể gửi file mobi lên cloud của hãng Amazon - hãng sản xuất ra Kindle ấy, hãng đó không hỗ trợ tính năng này cho azw3. Sau đó khi Kindle kết nối internet thì file đó sẽ được download về máy (hay không cần cắm cab đề copy từ máy tính), nếu trên đt có cài phần mềm Kindle thì khi đăng nhập vào cùng tài khoản Amazon với Kindle thì cũng download được về đt và trạng thái đọc sách, đánh dấu các đoạn sẽ đồng bộ giữa hai thiết bị.

    Nhiều khi lười mở máy tính, hoặc đang ở xa máy tính mà vẫn muốn có 1 ebook trên Kindle, tôi convert online epub/azw3/word... nào đó sang mobi rồi gửi lên mây, thế là cũng có ebook để đọc như trên.
     
  13. vinaguy

    vinaguy Lớp 11

    Bác hiểu sai ý em nữa rồi nè :) Em đang muốn bàn về css online của epub cơ, chứ không bàn về mobi, azw3 hay prc gì cả vì em chẳng hiểu mấy vị này. Còn em muốn hỏi bác dùng chương trình sửa sách nào để mở prc ra sửa cơ, vì có lúc em chỉ lượm được mỗi file prc, muốn mở ra sửa mà chả biết đường, nên em hỏi dùng gì để mở ra edit. :)
    Em không đọc sách bằng điện thoại, cũng như Kindle, em đọc bằng tablet (máy tính bảng) của Samsung (vẫn y như trang sách thật, có cả nền sách ố màu và rách lem nhem như trang sách thật luôn :)). Cũng có mắc gì đâu bác (không khéo còn rẻ hơn Kindle ấy chứ). Nhưng tính năng thì như cái điện thoại, nên cách sử dụng đa dạng phong phú, thích thì đọc sách/xem tivi/hát kara/làm việc trên nó luôn (giờ em toàn làm việc online - và cái tablet của em gần giống như cái laptop á bác, nếu bác có tablet, em sẽ chia sẻ với bác một số app để làm việc trên tab, hay lắm bác ạ).
    Còn đồng bộ đám mây này thì em xài lâu lắm rồi (em dùng từ năm 2009 cơ). Các đám mây em đang dùng là 1) Dropbox, 2) Onedrive, 3) Box. Em liên thông giữa tất cả các máy tính em ngồi (1 cái máy bàn, 2 cái laptop, máy điện thoại 3 cái, máy tablet 2 cái) đều chung đám mây của 1) Dropbox, 2) Onedrive nên ngồi đâu em cũng làm việc được, và ngồi đâu cũng moi sách ra xem được bác ạ (vừa sửa sách bằng cali trên máy tính, bấm lưu phát là mở nó trên điện thoại để kiểm tra được ngay và luôn). Không dây nhựa gì hết. Moon cũng cho bác đồng bộ cả cuốn sách cũng như bookmark, vị trí đang đọc dở của máy này lên máy khác, nên mở sách trên bất cứ máy nào nó cũng ra đúng vị trí đang đọc cả bác ạ.
    Kết luận: Bác nên mua cái Tablet và dẹp cái Kindle đi bác :) (em thấy bác mô tả cái Kindle phức tạp quá đi mất - mà chỉ để mỗi xem sách)
     
  14. RGBCD

    RGBCD Lớp 3

    Thôi, không nói chuyện với bạn nữa, mất thời gian quá vì những cái tủn mủn vô ích.

    Bạn hỏi tôi: "Bác lấy cái gì để mở kindle ra mà edit thế? Hỏi thế thôi, chứ em cũng không dùng prc bao giờ." Rõ ràng là hiểu sai ý tôi. Tôi nói dùng prc để đọc ở chỗ nào? Trên kia là tôi bàn về việc tính năng position: absolute gây lỗi trên Kindle khi đọc azw3 và tôi đã tìm ra nguyên nhân. Và tôi đang bàn về Kindle chứ không bàn về đt hay máy tính bảng.

    Vụ css online thì tôi chưa quan tâm, chẳng qua quote lẫn vào thôi.

    Tablet tôi dùng 2 đời máy Samsung, một đời máy Lenovo (cái đầu tiên mua năm 2010) rồi màn từ nhỏ đến lớn và chán luôn vì quá nặng nên không cơ động. Dùng một hai tháng thì quẳng cho con chơi, giờ bọn nó lớn cả rồi và không dùng tablet nữa mà chỉ đt. Mấy cái tab thì cũng đã hỏng hết, hỏi bọn nó có muốn mua cái mới không thì đều nói là không cần.

    Thôi chấm dứt ở đây, có quote nữa là tôi không trả lời nữa đâu.
     
  15. tran ngoc anh

    tran ngoc anh Cử nhân

    Sao đâm ra cãi nhau rồi :D
     
    machine and RGBCD like this.
  16. RGBCD

    RGBCD Lớp 3

    Xóa.
     
    Chỉnh sửa cuối: 29/9/21
  17. machine

    machine Lớp 11

    Ẩn Heading
    Quyển Vui lòng đăng nhập hoặc đăng ký để xem link có bộ số dạng ảnh trang trí dùng làm tiêu đề chương rất đẹp.
    Nếu làm như thông thường, khai báo Heading sau thẻ body rồi hiển thị ảnh sẽ rối, thừa thông tin.
    a.jpg
    Giải pháp là vẫn khai báo Heading sau thẻ body như bình thường, sau đó Tạo mục lục (Generate Table of Contents) xong thì xóa khai báo Heading và lưu lại (Save) như hình dưới:
    b.jpg

    Nghĩa là sau khi Tạo mục lục (Generate Table of Contents) xong thì xóa <h1>Chương 22</h1> và các dòng tương tự đi.
    Dùng 1 lệnh thay thế Regex là xong.
    Find: <h1>(.*?)</h1>
    Replace: (để trống, không có gì)
    Mode: Regex
     
    tran ngoc anh thích bài này.
  18. vinaguy

    vinaguy Lớp 11

    Đừng làm thế bác ơi. Lỡ sau này sách có chỉnh sửa gì lại phải làm lại header.
    Bác làm theo cách này:
    Ví dụ:
    <h1>Chương 22</h1>
    Bác chuyển thành <h1 class="hidden">Chương 22</h1>
    Trong css, bác khai dùm em:
    .hidden {
    display: none;
    }
    upload_2021-12-11_9-16-34.png

    Dùng để làm bìa cho cuốn sách nhiều tập đóng lại một cục: H1 không xuất hiện trong trang bìa nhé bác.
    upload_2021-12-11_9-17-21.png

    upload_2021-12-11_9-18-26.png

    Bác có thể mổ cuốn Tâm Lý Tội Phạm - Lôi Mễ của em ấp lên forum về xem cấu trúc.
    À, em còn cuốn này, chỉnh sửa nhiều hơn, sửa hết sạch lỗi chính tả, mà chưa kịp ấp lên :)
     
    Chỉnh sửa cuối: 11/12/21
    tran ngoc anh, Anan Két and machine like this.
  19. machine

    machine Lớp 11

    Như quyển Vui lòng đăng nhập hoặc đăng ký để xem link, Dropcap hiển thị theo quy luật, ngay sau Heading 2 nên mình dùng "h2 + p:first-letter" cho nhanh :D
    dropcap.jpg
     
    Chỉnh sửa cuối: 1/8/22
    vinaguy and tran ngoc anh like this.
  20. vinaguy

    vinaguy Lớp 11

    Dùng kiểu này... Mẹ nó... Moon nó không nhận mới ác chớ. Cơ mà từ kiểu này em chuyển về kiểu 'truyền thống' kia thì cũng mất khoảng 3 phút...
    Cơ mà... hình như làm kiểu truyền thống mình có nhiều tùy biến cho DropCap hơn phải không bác nhễ? Kiểu này nó có nhận dấu ngoặc kép (") hoặc dấu (-) hoặc con số ở đầu tiên không bác?
    Làm kiểu này có lợi là khi soát lỗi chính tả bằng từ điển không bị bắt lỗi.
    P/S: Trong css khai báo h2, bác nên thêm một dòng: text-indent: 0; vào đi bác để nó kéo lề ra ngoài.
     
    Chỉnh sửa cuối: 2/8/22

Chia sẻ trang này