近期发现和总结的知识跟大侠们分享,请大侠们多多评论指教一二?
HTML
1、(1)body需设置页面默认字体大小 body{font-size:12px;}
(2)IE6下png图片划过切换失效,建议使用gif、jpg
(3)在布局当中左右div自适应高度相等,需要两个先天条件:
1.外层box需设置overflow:hidden;
2.左或右一侧均可以设置margin-bottom:-9999px;padding-bottom:9999px;达到左右对齐
(4)浏览页面背景固定在body上:
<body style="height:1000px;background:url(../images/20hills.jpg) no-repeat fixed #8ce2fd center top;"></body>
(5)布局代码我也是才发现的,哈哈看一哥们写的被我发现了。
<fieldset style="border:1px solid #000;" >//可以改变边框颜色
<legend>用户登录</legend>
</fieldset>
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAq8AAABBCAIAAABw0toRAAAEI0lEQVR4nO3dvW7bMBQGUL95XyNLtyDv0BfIWHTvVnTr2szuUNRwJYq6lPVj8Z6DiyKxLVkOKfEzrcqXKwCQ2+XoDQAADiYNAEB2T5EGLpfmzViwCABQtNqYepkTWTy48utdGigu9ciWAEA2a6aB+K+RNdQfFskEjzwLAORxWBpomksojvqLpweWvkQA6NORaSC+tutoMqB4y4LtBAAOO2+gNQ0Ub1ww5WCSAAAGzjQ3sHhcH88oAAA35aHx7fVltoYr2uW8gfJrmFvk9vNUdIi8XqWUUqqb+vb1/b9Bszi+vr2+fPz+Va/xkBz/tXjLlMFYXgwNxbUN7q084+yLVUoppbqpnz++f/w/jtfSQHC0rgzVlcn8YBqoT/IHPyOIfJoAAEmMR/k100D81+ItrU8RXMktCggEAHDtIA3MTjmMH38dfdbQ+rwA0JOt0sDsYN90VuCDxkFh8LNMAEBm504D8QmGA7MIADy5TdJA6/n8jwzGretxxgAADKyfBiLvzh+MArP/W6E+8y8KAMC9Dc8iBABOQRoAgOykAQDIThoAgOykAQDIThoAgOykAQDIruc08OnzF9VHHd2Vog7/Q6m16uiuBHvbNg20Xudn3esC2aX7EGnHR74EK/6tV7N0uT5oRxLa7zsMN12qyC7dh2AaiH/3RNP3XjbR5fqgHUlow28tmr1acPACw4uP13bpPuwwN9C8TRN0uT5oRxLa7zsMp27cjl26D7PtGO9sAigR2pGEjpwbmH18/OmK7NJ9iKSBy7+vplwwtJsbYEA7ktABcwPBd3LSAH/V27E42EcSwIpTAsFN5Sy0IwkdMDdQOXybG2Cs0o5T+XK2C93fNfXzArpcH7QjCT3L3MAW7NJ9aD1voBI67x9jboAp2pGE9k4D4wN3RPx579ml+7A4DYzvKi5iboAB7UhCK6eB4Oh+O+ZGDr7FADG71NUu3YumNDDuWpVgGoyeulw22pGEdroy8dSh9v6QHUwMDs3ZxNPAVCyo95nZ7qTLZaMdSWjzNFCfCVh2V5Bdug/BNHD7d5wpi4GyaXpgrU3lFLQjCW17ZeLxUXj8mNa7vFHLZsWrD8UXHzxAl0tFO5LQJmlg6ujpkwIWkAbYmXYkoU3OIizefq2mgam1zT6mwi7dB1cmZmfakYR2OovwuvQNnA9xOVE7nmhTqdCOJLRfGtifXboPJ2rHE20qFdqRhKQBnt2J2vFEm0qFdiQhaYBnd6J2PNGmUqEdSajzNKD6qKO7UtThfyi1Vh3dlWBvPacBACBCGgCA7KQBAMhOGgCA7KQBAMhOGgCA7KQBAMhOGgCA7KQBAMhOGgCA7KQBAMhOGgCA7BrSwLev72+vL0oppZTqr0Jp4OeP7x+/fymllFKq15pPAwBAHtIAAGQnDQBAdtIAAGT3BwAczQCT2ha/AAAAAElFTkSuQmCC" alt="" /> 2、ctrl+shift+c 折叠所选 ctrl+shift+j 折叠完成标签 ctrl+shift+e 撤销折叠 3、分享下最近学习的布局技巧也就是博客园最外框的布局:注释(随着浏览器大小自适应内容块)
<div style="margin:100px 310px 10px 220px;background-color:#999;height:600px;padding:20px;font-size:20px;">
<div >
【编辑推荐】减少.NET应用程序内存占用的一则实践 (52/5601) »<br />
[最多推荐]Fish Li 该如何帮助您呢?(78/2722) »<br />
[最多评论][正能量系列]失业的程序员(三)(34/1406)<br />
[新闻头条]研究员公开TOM-Skype关键词黑名单(21/1951) »<br />
[推荐新闻]2013年3月TIOBE编程语言排行榜:Javascript正被开发者抛弃?(6/2528) »
</div>
<div style="width:200px;height:500px; background-color:#F00;position:absolute;left:15px;top:100px;">左侧</div>
<div style="width:290px;height:500px; background-color:#00F;position:absolute;right:15px;top:100px;">右侧</div>
</div> aaarticlea/png;base64,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" alt="" />
css
1、css选择器 个人常用推荐:列如id class类 可以多个调用 aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJkAAABPCAIAAAB3WfDfAAAEr0lEQVR4nO1YQY4DIQzj/59mbytKbGNmigooVg8UguOJJ6il1MQtKL8WkPgaiJdFLf4AZScx/5iS9OARxJYCVg/xsm4m5hkePALcUvAYxXZGlmamhMgSIgtaiikif7sL5nqAFeJhwDBRRfGiCLXZoisJhl0OzR6ViUktYsjjsOlEXxcPY3QiuMoiNScRYPSlyA1dhwwQ7HXzJx0sEh9j/PeDHT/6NBodVHZfapXd6hsvjcNkDovEx5gpLxmh6SXvQTTn9KXe++aMjdtNL81ybOilXxASQBo1Nn4J4/ZrZB8aWfhYZJnt9RXioSQzEcsOCzLk/xRveJk4BGnaPVjvZUGfU3CU+I2lJSaRXt6D9PIepJf3IL28B8TL3f5l7vkbckrPA/1iCyrICV6yO63j8EA83OLe4dVgJLxnapfivVRciin8Ozz2GA5WiIcBw0QVxYsi1GaLriQYdjk0e1QmJrWIIY9JKBJ9XTyM0YngKovUnESA0ZciN3QdMkBMNd/j03WR+Bjjvx/s+IE97aSjE+whhcpu9Y2X3zWyLhMfY6a8ZISml7wH0ZzTl3rvmzPWCWC0syXuVn/l5euCkEaNjV/CuP0a2YdGFj4WWWa9XCEeSjITseywIEP+T/GGl4lDkKbdg/VeFvQ5BUeJ31haYhLp5T1IL+9BenkP0st7QLzc7V/mnr8hp/Q80C+2oIKc4CW70zoOD8TDLe4dXg1GwnumdineS8WlmMK/w2OP4WCFeBgwTFRRvChCbbboSoJhl0OzR2ViUosY8kQNU1ghHsboRHCVRWpOIsDoS5Ebug4ZIB4038tj6oviY4z/frDjB/a0k45OsIcUKrvVN16a3exjkfgYM+UlIzS95D2I5py+1HvfnLFOAKOdLXG3+isvXxeENGps/BLG7dfIPjSy8DE7fMz6rhYPdZqJWHZYkCH/p3jDy8QhSNPuwXovC/qcgqPEbywtMYn08h6kl/cgvbwH6eU9IF7u+S9zt5+RU2IeiBdb0I/qc7zcUNIsHojXt32fYxTbVQ3eM7VL8V4qLsUUU3d4UZWJFeJhwDBRRfGiCLXZoisJhl0OzR6ViUktYsgj5h2sEA9jdCK4yiI1JxFg9KXIDV2HDBDsdWNGOpya7YviY4z/frDjh51Gw3R0gj2kUNmtvvESzrCHd7BIfIyZ8pIRml7yHkRzTl/qvW/OWM2vaWdL3K3+yku/ICSANGps/BLG7dfIPjSy8DHrP6cv4an1XfFQp5mIZYcFGfJ/ije8TByCNO0erPeyoM8pOEr8xtISk0gv70F6eQ/Sy3uQXt4D4uVu/zL3/Bk5JeaBeLEFVeMcLy/Ag6fQt32fYxTbGQnvmdqleC8Vl2KKqTu8x16uEA8DhokqihdFqM0WXUkw7HJo9qhMTGoRQ54a9ExhhXgYoxPBVRapOYkAoy9Fbug6ZIBg9uiGmMUi8THGfz/E8eNwwq8TfalVdqtvvDS72cci8TFmyktGaHrJexDNOX2p9745Y50ARjtb4m71V16+Lghp1Nj4JYzbr5F9aGThY3b4mPVdLR7qNBOx7LAgQ/5P8YaXiUOQpt2D9V4W9DkFR4nfWFpiEunlPfgDqznqcRXuw24AAAAASUVORK5CYII=" alt="" />
2、css3透明效果兼容IE浏览器:
.box{ filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150)
progid:DXImageTransform.Microsoft.gradient(startcolorstr=#E5F5FF,endcolorstr=#ffffff,gradientType=0);
-ms-filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150)
progid:DXImageTransform.Microsoft.gradient(startcolorstr=#E5F5FF,endcolorstr=#ffffff,gradientType=0); background:#E5F5FF; /* 一些不支持背景渐变的浏览器 */
background:-moz-linear-gradient(top, #E5F5FF, white); background:-webkit-gradient(linear, 0 0, 0 bottom, from(#E5F5FF),
to(#ffffff)); width:500px;height:200px;text-align:center; } aaarticlea/png;base64,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" alt="" /> 3、图片圆角自适应:
aaarticlea/png;base64,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" alt="" />
<li style="margin-right:10px;padding:0px 0 0 20px; background:url(/navbj.gif);font-size:14px;float:left;">
<span style="/navbj.gif) no-repeat right top;padding-right:20px;display:block;">圆角宽度自适应</span>
</li>