HTML \ CSS купонный скрипт - PullRequest
1 голос
/ 21 июля 2009

Кто-нибудь знает, как создать купон (даже лучше для печати) с HTML и CSS? Простите за ужасно простой вопрос, я мало занимаюсь веб-разработкой:)

Заранее спасибо.

РЕДАКТИРОВАТЬ: РЕДАКТИРОВАТЬ: Сет снова опубликовал свой ответ, который я принял, поэтому я удалил ответ отсюда (это была просто копия его оригинального удаленного сообщения).

Ответы [ 4 ]

5 голосов
/ 21 июля 2009

Полагаю, вы хотите

.coupon {
   width: 250px;
   padding: 10px;
   text-align: center;
   border: 3px dashed #ccc; }

  <div class="coupon">15 points for your reputation</div>

вокруг div? Или что-то более сложное?

Я украл его у здесь .

3 голосов
/ 21 июля 2009

Я не буду рассматривать HTML-часть вопроса, потому что это очень, очень просто и очень специфично для вас.

Для стилей, специфичных для печати, в вашей HTML-разметке вы можете явно добавить таблицу стилей для печатных СМИ, например:

<link rel="stylesheet" type="text/css" media="print" href="my-printable-style.css"/>

Вы также можете сделать это напрямую в существующем документе CSS, используя директивы CSS, например:

//sample ripped from http://www.w3schools.com/CSS/css_mediatypes.asp
@media screen
  {
  p.test {font-family:verdana,sans-serif;font-size:14px}
  }
@media print
  {
  p.test {font-family:times,serif;font-size:10px}
  }

но это обычно рассматривается как более слабый инструмент, потому что это может привести к путанице и проблемам с обслуживанием, чтобы раздуть один документ, подобный этому, и он достигает того же, что и метод на основе элементов.

Чтобы справиться с некоторыми печатными проблемами CSS, прочитайте этот список, кроме статьи .

0 голосов
/ 16 апреля 2016
<label for="dwfrm_cart_couponCode">
                         CODE
                        </label>
<input type="text" placeholder=" CODE" name="dwfrm_cart_couponCode" id="dwfrm_cart_couponCode">
<button type="submit" value="dwfrm_cart_addCoupon" name="dwfrm_cart_addCoupon" id="add-coupon">

                        </button>
<div class="error">
                                Please Enter a Code
                            </div>
0 голосов
/ 21 июля 2009

Эта статья содержит всю необходимую информацию простым и понятным способом. Надеюсь, это поможет вам.

...