整形したPDFダウンロードリンク

簡単なダウンロードリンク

ダウンロードはこちらから (PDF:700KB)


<a href="path/to/PDF_file.pdf" download="PDF_file.pdf">
    ダウンロードはこちらから
    <img src="path/to/images/Adobe_PDF_file_icon_32x32.png">  (PDF:700KB)
</a>

こちらからリーフレットをダウンロード (PDF: 700kB)


<link href="https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css" rel="stylesheet">

<a href="/assets/images/acrobat/sampleA4-compress.pdf" download="sampleA4-compress.pdf">
	<div class="PDFdl">
		<p><img src="/assets/images/acrobat/sampleA4.png" alt=""></p>
		<p>こちらからリーフレットをダウンロード (PDF: 700kB)</p>
		<p><i class="bx bxs-download bx-fade-down"></i></p>
	</div>
</a>

.bxs-download {
	font-size: 5rem;
	}

.PDFdl {
	width: 80%;
	margin: 2rem auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: rgba(255,255,0,.05);
	border: 1px solid #ee7836;
	}
.PDFdl img {
	width: 150px;
	height: auto;
	padding: 0;
	}
.PDFdl p:nth-child(2) {
	text-align: left;
	padding: 1rem;
	}
.PDFdl p:nth-child(3) {
	width: 100px;
	text-align: center;
	}

@media screen and (max-width: 767.9px) {
	.PDFdl {
		width: 98%;
		}
	.PDFdl p:nth-child(3) {
		display: none;
		}
	}

TOP