开发者

CSS Reset of table border

I have a reset.css file that includes the following declaration: border:0 none;

So when I make a table like this:

<table border="1">

The border does not show up. How do 开发者_StackOverflow中文版I get the border to show up without removing the border:0 none; property? The code must be <table border="1">. Is there a way to make the table "ignore" the reset.css file? (This must work across all browsers as well including IE 6+)


Add a style="border: 1px solid;" to the <table> tag. Styles override attribute settings.


Ok, so lets say you are in a jam, and lets assume:

  • You can't do anything suggested above
  • You can't use inline styles
  • You can't add a style to your html doc like:

    <style type="text/css">
      table { border: 1px solid; }
    </style>
    
  • You can't add a link to another stylesheet

Could you do something which is probably overkill, like use some javascript or jquery to do it?

<script type='text/javascript'>
  var tableStyle = "table { border: 1px solid;}";

  function appendStyle(tableStyle) {
    var css = document.createElement('style');
    css.type = 'text/css';

    if (css.styleSheet) css.styleSheet.cssText = tableStyle;
    else css.appendChild(document.createTextNode(tableStyle));

    document.getElementsByTagName("head")[0].appendChild(css);
  };

  window.onload = function() { 
    appendStyle(tableStyle); 
  };
</script>


directly after your reset css add a line like this:

table.borderIgnore { border:auto; }

then for your table do this:

<table class="borderIgnore" border="1">

let me know if that works

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜