.preImg { height:400px !important } <img id="preImg" class="preImg" style="width:100px;height:70px;background-color:#ccc;border:1px solid #333"/> 以上代码即可保证id为preImg的图片高度为400px,而不会被其自身的style覆盖.…
一.回顾内容 前端的三大组成(三大模块)    HTMl(超文本标记语言) 结构层    css(层叠样式表) 表现层:用来美化HTML结构    JS(Java script)(脚本语言) 行为层:提供用户和界面的交互 二.CSS(层叠样式表) 1. CSS的概念及其介绍CSS 指层叠样式表 (Cascading Style Sheets)作用:美化HTML结构,重点:css可以很好的将结构内容和表现进行分离.2. css的三种表现形式(引入方法)css的语法结构:选择器{属性:值;属性:值;…
[行间样式获取] <div id='div1' style="backgroud:red">测试</div> <script> var odiv=document.getElementById('div1'); //先获取到要获取样式的元素标签,也就是获取到div1 console.log(odiv.style.background);    //这样我们就可以获取到了行间的样式了 </script> [内连样式获取] <html&…
平常的开发中我们一般使用到圆角都是外凸的,即border-radius属性.而如果有内凹角的情况,我们一般的考虑实现方法有2种.一种是直接使用背景图片,一种是使用css. 用到的属性则是background或background-image 结合径向渐变radial-gradient.示例: background-image: radial-gradient(200px at 50px 0px, #fff 50px, #4169E1 50px); 而对于径向渐变,主要是3个参数控制. 一个是原点…
外联样式 有样式表a.wxss和index.wxss如下: /**a.wxss**/ .container1{ border: 1px solid #000; } /**index.wxss**/ .container1{ color: red; } 若想在index.wxss中引入a.wxss,则只需在index.wxss中使用语句@import"./a.wxss";即可,此时index.wxss如下: /**index.wxss**/ @import"./a.wxss&q…
CSS:层叠式样式表 1.对层标签整体进行操作 <div style="width:200px;height:200px;background-color:blue"></div> 宽度            width:200px/50% 高度            height:200px/50% 背景色         background-color:red/#颜色代码 背景图片      background-image:url(图片路径) 背景图片排…
HTML5文档类型(Doctype) Bootstrap使用了一些HTML5元素和CSS属性,所以需要使用HTML5文档类型. <!DOCTYPE html> <html> .... </html> 移动设备优先 <meta name=”viewport” content=”width=device-width, initial-scale=1.0”> 宽度设置为device-width可以确保它能正确呈现在不同设备上. initial-scale=1.0确…
JS获取内联样式 //获取内联样式 function getCss(obj,attr){//obj:对象,name:style属性 if(obj.currentStyle) { return obj.currentStyle[attr]; } else { return document.defaultView.getComputedStyle(obj,null)[attr]; } } 大家都知道,用document.getElementById(‘element').style.xxx可以获取…
在HTML中定义样式的方式有三种:通过<link/>元素包含外部样式表文件(外部样式表).使用<style/>元素定义嵌入式样式(嵌入式样式表).使用style特性定义针对特定元素的样式(内联样式表). 要确定浏览器是否支持DOM2级定义的css的能力可以用 document.implementation.hasFeature("css2","2.0");//支持返回true,不支持返回false 1.访问元素样式 任何支持style特性的h…
一句话: 大多数html标签属性和事件都有一个对应的ng指令 说明:这些指令和原生html最大的区别就是可以动态更新.比如一个div的样式用ng-class后,我们就可以随意应用css class. 1. 内置指令大全 ng-include 包含一个文件 ng-href ng-src 对应 href src ng-disabled ng-readonly 对应 disabled readonly ng-checked ng-selected ng-options ng-true-value ng…