Menandakan "Bom PDF" - Trik CSS

Anonim

Tautan jangkar apa pun bisa menjadi tautan ke dokumen PDF, tetapi mengeklik tautan seperti itu berpikir sebaliknya bisa mengejutkan dan tidak nyaman bagi pengguna. CSS ini dapat menandakan link tersebut secara visual.

/* Add " (PDF)" text after links that go to PDFs */ a(href$=".pdf"):after ( content: " (PDF)"; ) /* If file size specified as data attribute, use that too */ a(href$=".pdf")(data-size):after ( content: " (PDF, " attr(data-size) ")"; )

Begitu…


Watch out for the PDF bomb here!

Secara visual menjadi:

Watch out for the PDF bomb (PDF) here!

Atau…


Watch out for the PDF bomb here!

Menjadi:

Watch out for the PDF bomb (PDF, 2 MB) here!

Lihat Pen Identify PDF Bombs oleh Chris Coyier (@chriscoyier) di CodePen.