English 中文(简体)
CSS 办法
原标题:CSS Styled Option Buttons?

我工作的人通过一些渠道,为某个人打上了电子商务网站,并且进入了我不敢肯定的东西。 目前,产品页有选择产品规模的无线电台。 此前,我已经下降。 客户希望打上类似于

我的法典部分目前案文如下:......

<td valign="top" width="910">
<div id="content"><?php echo $content_top; ?>
<h1><?php echo $heading_title; ?></h1>

<div class="right">


 <?php if ($price) { ?>
  <div class="price">
    <?php if (!$special) { ?>
    <?php echo $price; ?>
    <?php } else { ?>
    <span class="price-old"><?php echo $price; ?></span> <span class="price-new"><?php echo $special; ?></span>
    <?php } ?>
    <br />

    <?php if ($tax) { ?>

    <?php } ?>
    <?php if ($points) { ?>
    <span class="reward"><small><?php echo $text_points; ?> <?php echo $points; ?></small></span> <br />
    <?php } ?>
    <?php if ($discounts) { ?>
    <br />
    <div class="discount">
      <?php foreach ($discounts as $discount) { ?>
      <?php echo sprintf($text_discount, $discount[ quantity ], $discount[ price ]); ?><br />
      <?php } ?>
    </div>
    <?php } ?>
  </div>





  <?php
$get_meta_desc = "SELECT meta_description
FROM product_description
WHERE product_id =  ".$product_id." ";
$get_meta_res = mysql_query($get_meta_desc);
$meta_desc = mysql_fetch_array($get_meta_res, MYSQL_ASSOC);
if ($meta_desc[ meta_description ]) {
echo "<p id="cmmeta-desc">".$meta_desc[ meta_description ]."</p>";
}
mysql_free_result($get_meta_res);
?>


  <?php } ?>
  <?php if ($options) { ?>
  <div class="options">



    <?php foreach ($options as $option) { ?>
    <?php if ($option[ type ] ==  select ) { ?>
    <div id="option-<?php echo $option[ product_option_id ]; ?>" class="option">
      <?php if ($option[ required ]) { ?>
      <span class="required">*</span>
      <?php } ?>
      <b><?php echo $option[ name ]; ?>:</b><br />
      <select name="option[<?php echo $option[ product_option_id ]; ?>]">
        <option value=""><?php echo $text_select; ?></option>
        <?php foreach ($option[ option_value ] as $option_value) { ?>
        <option value="<?php echo $option_value[ product_option_value_id ]; ?>"><?php      echo $option_value[ name ]; ?>
        <?php if ($option_value[ price ]) { ?>
        (<?php echo $option_value[ price_prefix ]; ?><?php echo $option_value[ price ]; ?>)
        <?php } ?>
        </option>
        <?php } ?>
      </select>
    </div>
    <br />
    <?php } ?>
    <?php if ($option[ type ] ==  radio ) { ?>
    <div id="option-<?php echo $option[ product_option_id ]; ?>" class="option">
      <?php if ($option[ required ]) { ?>
      <span class="required">*</span>
      <?php } ?>
      <b><?php echo $option[ name ]; ?>:</b><br />
      <?php foreach ($option[ option_value ] as $option_value) { ?>
      <input type="radio" name="option[<?php echo $option[ product_option_id ]; ?>]" value="<?php echo $option_value[ product_option_value_id ]; ?>" id="option-value-<?php echo $option_value[ product_option_value_id ]; ?>" />
      <label for="option-value-<?php echo $option_value[ product_option_value_id ]; ?>"><?php echo $option_value[ name ]; ?>
        <?php if ($option_value[ price ]) { ?>
        (<?php echo $option_value[ price_prefix ]; ?><?php echo $option_value[ price ]; ?>)
        <?php } ?>
      </label>
      <br />
      <?php } ?>
    </div>
    <br />
    <?php } ?>
    <?php if ($option[ type ] ==  checkbox ) { ?>
    <div id="option-<?php echo $option[ product_option_id ]; ?>" class="option">
      <?php if ($option[ required ]) { ?>
      <span class="required">*</span>
      <?php } ?>
      <b><?php echo $option[ name ]; ?>:</b><br />
      <?php foreach ($option[ option_value ] as $option_value) { ?>
      <input type="checkbox" name="option[<?php echo $option[ product_option_id ]; ?>][]" value="<?php echo $option_value[ product_option_value_id ]; ?>" id="option-value-<?php echo $option_value[ product_option_value_id ]; ?>" />
      <label for="option-value-<?php echo $option_value[ product_option_value_id ]; ?>"> <?php echo $option_value[ name ]; ?>
        <?php if ($option_value[ price ]) { ?>
        (<?php echo $option_value[ price_prefix ]; ?><?php echo $option_value[ price ]; ?>)
        <?php } ?>
      </label>
      <br />
      <?php } ?>
    </div>
    <br />
    <?php } ?>
    <?php if ($option[ type ] ==  text ) { ?>
    <div id="option-<?php echo $option[ product_option_id ]; ?>" class="option">
      <?php if ($option[ required ]) { ?>
      <span class="required">*</span>
      <?php } ?>
      <b><?php echo $option[ name ]; ?>:</b><br />
      <input type="text" name="option[<?php echo $option[ product_option_id ]; ?>]" value="<?php echo $option[ option_value ]; ?>" />
    </div>
    <br />
    <?php } ?>
    <?php if ($option[ type ] ==  textarea ) { ?>
    <div id="option-<?php echo $option[ product_option_id ]; ?>" class="option">
      <?php if ($option[ required ]) { ?>
      <span class="required">*</span>
      <?php } ?>
      <b><?php echo $option[ name ]; ?>:</b><br />
      <textarea name="option[<?php echo $option[ product_option_id ]; ?>]" cols="40" rows="5"><?php echo $option[ option_value ]; ?></textarea>
    </div>
    <br />
    <?php } ?>
    <?php if ($option[ type ] ==  file ) { ?>
    <div id="option-<?php echo $option[ product_option_id ]; ?>" class="option">
      <?php if ($option[ required ]) { ?>
      <span class="required">*</span>
      <?php } ?>
      <b><?php echo $option[ name ]; ?>:</b><br />
      <a id="button-option-<?php echo $option[ product_option_id ]; ?>" class="button"><span><?php echo $button_upload; ?></span></a>
      <input type="hidden" name="option[<?php echo $option[ product_option_id ]; ?>]" value="" />
    </div>
    <br />
    <?php } ?>
    <?php if ($option[ type ] ==  date ) { ?>
    <div id="option-<?php echo $option[ product_option_id ]; ?>" class="option">
      <?php if ($option[ required ]) { ?>
      <span class="required">*</span>
      <?php } ?>
      <b><?php echo $option[ name ]; ?>:</b><br />
      <input type="text" name="option[<?php echo $option[ product_option_id ]; ?>]" value="<?php echo $option[ option_value ]; ?>" class="date" />
    </div>
    <br />
    <?php } ?>
    <?php if ($option[ type ] ==  datetime ) { ?>
    <div id="option-<?php echo $option[ product_option_id ]; ?>" class="option">
      <?php if ($option[ required ]) { ?>
      <span class="required">*</span>
      <?php } ?>
      <b><?php echo $option[ name ]; ?>:</b><br />
      <input type="text" name="option[<?php echo $option[ product_option_id ]; ?>]" value="<?php echo $option[ option_value ]; ?>" class="datetime" />
    </div>
    <br />
    <?php } ?>
    <?php if ($option[ type ] ==  time ) { ?>
    <div id="option-<?php echo $option[ product_option_id ]; ?>" class="option">
      <?php if ($option[ required ]) { ?>
      <span class="required">*</span>
      <?php } ?>
      <b><?php echo $option[ name ]; ?>:</b><br />
      <input type="text" name="option[<?php echo $option[ product_option_id ]; ?>]" value="<?php echo $option[ option_value ]; ?>" class="time" />
    </div>

    <?php } ?>
    <?php } ?>
  </div>
  <?php } ?>
  <div class="cart">
    <div><?php echo $text_qty; ?>
      <input type="text" name="quantity" size="2" value="<?php echo $minimum; ?>" />
      <input type="hidden" name="product_id" size="2" value="<?php echo $product_id; ?>" />
      &nbsp;<a id="button-cart" class="button2"><span>ADD TO BAG</span></a></div>



    <?php if ($minimum > 1) { ?>
    <div class="minimum"><?php echo $text_minimum; ?></div>
    <?php } ?>
  </div>

以前从来没有做过这样的事情......

Many Thanks L

最佳回答
问题回答

在你联系的网站上,他们使用<代码>电子<>代码/代码>内有各种选择的内容。 然后,该清单被印章所掩盖,并且利用可以轻易作风的降水办法编制一个链接清单(a)。 如果你点击其中的一个环节,则与最初的选定要素挂钩。 可以用 Java字很容易做到这一点。

If you disable Javascript in your browser, and check out that site, you will see the underlying form elements.

不幸的是,无线电塔顿、检查箱和下台等内容不能真正通过安全局作风,只能以非常有限的方式。 多数解决办法(如“Graeme”所贴出的,但thous and others) 均使用Javascript来掩盖这些内容,并使用与原始内容相关的替代元素。

如果你只想使用CSS,就会有一个trick熟的CSS3解决方案,但只有现代浏览器(无IE8或下级)才能工作。 在我先前的一个职位上,你可以看到一个例子:。 检查箱

I think you are referring to the GO button. This is an input element of the type image. Which means it s a clickable button that consists of an image. So in order to get the nice square button, you have to create an image, upload it, and refer to it in the src attribute of your input tag.
Here s an example that looks quite dated, but is simple and straight forward:
http://www.echoecho.com/htmlforms14.htm
It also describes the options.

如果你不再使用,也许会是一个有用的预兆:如果你在你想要使用的一个地点越过某个地点,就使用一种检查工具,如“火焰”来观察它是如何取得的。

http://www.un.org。

产品大小纽吨实际上不是无线电纽子,而是使用CSS的列表项目<li>和风格。 他们所代表的价值是用一件 j印记来登记。 当你打上了 submit子时,便张贴了这一信息。 我不知道 如果你熟悉javascript和(或)使用javascript框架,但你的情况是利用这一框架的好情况。

I ve created this jsfiddle with a very straightforward solution, using plain javascript: http://jsfiddle.net/r2K9h/3/
it sets a hidden input field with the size selected. So when you send the form, this value will be submitted as well.





相关问题
CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

jquery ui dialog opens only once

I have a button that opens a dialog when clicked. The dialog displays a div that was hidden After I close the dialog by clicking the X icon, the dialog can t be opened again.

Drop down background url in Safari Issue

selectBox.selectCSS { background: url(/Images/replacementSelectBackground.png) top left no-repeat height:auto; } I have an issue in Safari only where the image is not rendering on top ...

CSS specific for Safari

How do you target specifically safari in css with styles?

Aligning textarea in a form

Ive used the following css code to align my form elements: form { position:relative; } form input { position:absolute; left:11em; } However, the textarea element is not aligned correctly with the ...

Firefox background image horizontal centering oddity

I am building some basic HTML code for a CMS. One of the page-related options in the CMS is "background image" and "stretch page width / height to background image width / height." so that with large ...

CSS problem with page footer

I have defined my page footer in the css file as: #footer { position: absolute; height: 50px; text-align: center; background: #66CCCC; bottom: 0px; left: 0px; width: 100%; height: ...

热门标签