博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
HTML+CSS 工作笔记
阅读量:5170 次
发布时间:2019-06-13

本文共 1686 字,大约阅读时间需要 5 分钟。

遇到问题汇总

一,HTML

  1. 如果要设置span的宽度,必须要将display:inline-block; 当前也可以设置为:display : block不过他就不是行内元素了所以他会换行。
  2. 要设置table的列宽度,只需要设置第一列的宽度是多少,后面的行都一样了。

二,CSS

  1. 取消 li 的 圆圈方式:ul{list-style-type:none;}
  2. s
  3. s

CSS Hack:

首先是关于CSS在各浏览器之间的兼容问题,以下是具体代码。

select {background-color:red\0;  /* ie 8/9*/background-color:blue\9\0;  /* ie 9*/*background-color:#dddd00;  /* ie 7*/_background-color:#CDCDCD;  /* ie 6*/}*+html #bgcolor {    background:green !important; /* IE7 */background-color::brown\9; //所有IE浏览器} /* Opera */html:first-child #opera{display: block;}/* IE 7 */html > body #ie7{*display: block;}/* IE 6 */body #ie6{_display: block;}/* Firefox 1 - 2 */body:empty #firefox12{display: block;}/* Firefox */@-moz-document url-prefix(){#firefox { display: block; }}/* Safari */@media screen and (-webkit-min-device-pixel-ratio:0){#safari { display: block; }}/* Opera */@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0){head~body #opera { display: block; }}

 

注意写hack的顺序,其中:

    1. background-color:red\0;IE8和IE9都支持; IE6、IE7不能.

    2. background-color:blue\9\0; 仅IE9支持;

    3. "*" IE6、IE7可以识别.IE8、FireFox不能.

    4. "_" IE6可以识别"_",IE7、IE8、FireFox不能.

    5. IE7 认 !important, 也认 *+html, 优先度: (*+html + !important) > !important > +html

HTML界面骨架

          往往在HTML布局方面其实最主要就是运用HTML标签的结构出了问题,比如说今天(2011.8.25)我就出现了这样的问题,先给自己找哈借口可能有1,2年没有写WEB的原因。微笑 

           其实要实现的功能很简单就是如下效果:

结果可能调了1个多小时都没搞定,最后只有请求同学帮忙。 我开始的HTML结构是<div>+<a>+<span>…  a的背景图片为框框,span 设置高度宽度来做箭头,结果老是没有变法办规矩,出现这样的效果,。具体原因我也不清楚是怎么回事。而同学给我的HTML结构却是<div>+<table><td><a></td><td><span></td>… 最终解决了战斗。

         说说为什么他这样能很快的搞定,他充分的运用了HTML每个标签的特性,要实现这类连续的东西,其实TABLE就很快能搞定。如果你不喜欢用TABLE其实还有另一种解决方案,那就是用UL+LI 也同样可以实现。

转载于:https://www.cnblogs.com/jiguixin/archive/2011/08/24/2152025.html

你可能感兴趣的文章
富文本编辑器 - RichEditor
查看>>
java webcontroller访问时报415错误
查看>>
qcow2、raw、vmdk等镜像格式
查看>>
Jzoj5455【NOIP2017提高A组冲刺11.6】拆网线
查看>>
特定字符序列的判断(1028)
查看>>
华为面试
查看>>
平衡二叉树(AVL Tree)
查看>>
【BZOJ3295】[Cqoi2011]动态逆序对 cdq分治
查看>>
【CF799E】Aquarium decoration 线段树
查看>>
大运飞天 鲲鹏展翅
查看>>
从ECMA到W3C
查看>>
软件工程--第十六周学习进度
查看>>
yii2 ActiveRecord多表关联以及多表关联搜索的实现
查看>>
搜狗输入法安装--ubuntu
查看>>
ps/2接口键盘的输入及显示
查看>>
Swift———a Glance(极客学院)笔记
查看>>
【poj3294-不小于k个字符串中最长公共子串】后缀数组
查看>>
java如何获取其它用户登录的真是IP地址
查看>>
Jquery通过指定层次关系获取元素
查看>>
c# for 和 foreach 的区别
查看>>