且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

一些小巧的HTML,CSS和JS问题

更新时间:2023-11-24 19:16:34

1。问题1:



  #BrowserVisible {
background:url('http://www.joelandamywedding.com/images /upload.JPG')100%5px no-repeat;
height:32px;
}



2。问题2& 3:



使用CSS重置。 规范化 Eric Meyer的。或者如果你不确定,你可以使用这个,但它不解决一切:

  * {margin:0; padding:0; list-style:none;} 



3。问题4:



在您的服务器端,请提供标题: Content-disposition:attachment;



从浏览器打印PDF:



您可以使用JavaScript从浏览器与读取器通信显示文件。
我在一个问题中找到了另一种方法可能值得尝试:

 < html> 
< script language =javascript>
timerID = setTimeout(exPDF.print();,1000);
< / script>
< body>
< object id =exPDFtype =application / pdfdata =111.pdfwidth =100%height =500/>
< / body>
< / html>

想法是在浏览器中使用javascript指示PDF阅读器打印文件。此方法适用于嵌入HTML页面的PDF文件。


My attempts are viewable on http://bit.ly/S4je19

Issue 1: The upload button should be moved down about 5px to be inline with the "select image" file input. I can't seem to get it to move that drop down, why?

Issue 2: Name, Postcode and Email sit basically inline (end at the same area) on jsfiddle, but when uploaded to the server they don't?

Issue 3: On jsfiddle the absolute submit button on the bottom right does what it should, and the checkbox and "tick" text are inline. On the server off jsfiddle, the submit button sits inline with the checkbox and tick text and the checkbox sits higher than the "tick" text rather than inline? Why?

Issue 4: The download and prinst links. The download link should automatically download (cross-browser) but won't for all browser? The print link should open the file with a print dialog automatically (cross-browser) but again won't for all browsers? My code is in the JS area of my jsfiddle. This should work for any browser - maybe someone can provide a better solution?

Thanks!

Dave

1. Issue 1:

#BrowserVisible {
    background: url('http://www.joelandamywedding.com/images/upload.JPG') 100% 5px no-repeat;
    height: 32px;
}

2. Issue 2 & 3:

Use a CSS Reset. Either Normalise or Eric Meyer's. Or if you are not sure, you can use this, but it doesn't solve everything:

* {margin: 0; padding: 0; list-style: none;}

3. Issue 4:

In your server side, please give the header: Content-disposition: attachment; in order to force browsers to download instead of viewing inline.

Printing a PDF from the browser:

You can use JavaScript from the browser to communicate with the reader that shows the file. I found this other approach in a question that might worth trying:

<html>
<script language="javascript">
timerID = setTimeout("exPDF.print();", 1000);
</script>
<body>
<object id="exPDF" type="application/pdf" data="111.pdf" width="100%" height="500"/>
</body>
</html>

The idea is to use javascript in the browser to instruct the PDF reader to print the file. This approach will work on PDF files embedded in a HTML page.