Chỉ in văn bản

Question

Tôi muốn in chỉ nội dung của phần tử văn bản từ trang web. Đặc biệt, tôi muốn đảm bảo rằng không có gì bị cắt bớt bởi ranh giới của vùng văn bản vì nội dung sẽ khá lớn.

Chiến lược tốt nhất để giải quyết vấn đề này là gì?

Answer 1

Tạo biểu định kiểu in trong đó tất cả các thành phần ngoại trừ vùng văn bản được đặt trong CSS để hiển thị: none ;, và đối với vùng văn bản, tràn: hiển thị.

Liên kết trang đó với thẻ liên kết trong tiêu đề được đặt thành phương tiện = "in".

Bạn đã hoàn tất.

Answer 2

Tạo một CSS khác nhau với phương tiện truyền thông thiết lập để in

<link rel="stylesheet" type="text/css" href="print.css" media="print" /> 

http://webdesign.about.com/cs/css/a/aa042103a.htm

Answer 3

Nếu người dùng nhấp chuột "In", bạn có thể mở một cửa sổ mới với chỉ các nội dung của textarea trên một trang trống và bắt đầu in từ đó, sau đó đóng cửa sổ đó.

Cập nhật: Tôi nghĩ rằng các giải pháp CSS được đề xuất có lẽ là chiến lược tốt hơn, nhưng nếu ai thích đề xuất này, họ vẫn có thể nâng cấp nó.

Answer 4

Tôi muốn kết hợp các đề xuất khác.

Đừng giết nút in cho toàn bộ trang bằng ghi đè biểu định kiểu, nhưng thay vào đó cung cấp nút bằng văn bản, cho phép người dùng chỉ in những nội dung đó.

Đó nút sẽ mở ra một cửa sổ mới, với thực đơn/chrome vv và sao chép nội dung textarea chỉ (và hoặc cung cấp một tập tin in css)

Answer 5

tôi đã thực hiện một CSS in phương tiện truyền thông để ẩn một số các lĩnh vực . Vấn đề là phức tạp bởi thực tế là tôi đã sử dụng nicEdit mà tự động tạo ra một IFRAME. Vì vậy, tôi đã phải thêm một sự kiện đã diễn ra sự kiện onblur và sao chép chúng vào một ẩn (trừ in ấn) Div. "divtext" là Div hiddent, và "storyText" là TextArea.

textarea { 
    display: none; 
} 

*/ #divtext { 
    display: block; 
} 

div, DIV { 
    border-style: none !important; 
    float: none !important; 
    overflow: visible !important; 
    display: inline !important; 
} 

/* disable nearly all styles -- especially the nicedit ones! */ 

#nav-wrapper, #navigation, img, p.message, .about, label, input, button, #nav-right, #nav-left, .template, #header, .nicEdit-pane, .nicEdit-selected, .nicEdit-panelContain, .nicEdit-panel, .nicEdit-frame { 
    display: none !important; 
} 

/*hide Nicedit buttons */ 

.nicEdit-button-active, .nicEdit-button-hover, .nicEdit-buttonContain, .nicEdit-button, .nicEdit-buttonEnabled, .nicEdit-selectContain, .nicEdit-selectControl, .nicEdit-selectTxt { 
    display: none !important; 
} 

Các mã javascript cho nicEdit:

<script type="text/javascript" src="/media/nicEdit.js"></script> 
<script type="text/javascript"> 
    bkLib.onDomLoaded(function() { 
    var nic = new nicEditor({ 
     fullPanel: true 
    }).panelInstance('storyText'); 

    document.getElementById("storyText").nic = nic; 
    nic.addEvent('blur', function() { 
     document.getElementById("storyText").value = 
     nic.instanceById('storyText').getContent(); 
     document.getElementById("divtext").innerHTML = nic.instanceById('storyText').getContent(); 
    }); 
    }); 
</script> 

Answer 6

Did overflow: có thể nhìn thấy; trên textarea thực sự làm việc cho bất kỳ của bạn? FF3 dường như bỏ qua quy tắc trên textarea trong các trang in. Không phải đó là lỗi hay gì cả.