本文目录
- 怎么用js获取div的当前宽度
- 网页设计如何设置网页部分内容不随着滚动条而移动移动
- currentstyle 属性的作用是什么
- 织梦currentstyle调用的css在哪里
- style=“text-decoration:underline;“是什么意思
- JavaScript是如何改变网页的CSS样式的
- 如何在DataGrid里面产生滚动条而不滚动题头
- css样式怎么调用
怎么用js获取div的当前宽度
第一种情况就是宽高都写在样式表里，就比如#div1{width:120px;}。这中情况通过#div1.style.width拿不到宽度，而通过#div1.offsetWidth才可以获取到宽度。
第二种情况就是宽和高是写在行内中，比如style=“width:120px;“，这中情况通过上述2个方法都能拿到宽度。（什么是行内，就是直接在html标签上写样式）
小结，因为id.offsetWidth和id.offsetHeight无视样式写在样式表还是行内，所以我们获取元素宽和高的时候最好用这2个属性。注意如果不是写在行内style中的属性都不能通过id.style.atrr来获取。
现在的前端制作很少直接把样式写style里了，都是写在样式表里。如果你要获取的样式没有相对应的（就像#div1.style.width对 应#div1.offsetWidth），就只能分别针对不用浏览器来获取样式表的属性了，可以试着搜索“JS 获取样式属性”之类的。
代码：
var o = document.getElementById(“view“);var h = o.offsetHeight; //高度var w = o.offsetWidth; //宽度
扩展资料：
js编程:
JavaScript是一种脚本语言，其源代码在发往客户端运行之前不需经过编译，而是将文本格式的字符代码发送给浏览器由浏览器解释运行。直译语言的弱点是安全性较差，而且在JavaScript中，如果一条运行不了，那么下面的语言也无法运行。而其解决办法就是于使用try{}catch(){}。
Javascript被归类为直译语言，因为主流的引擎都是每次运行时加载代码并解译。V8是将所有代码解译后再开始运行，其他引擎则是逐行解译（SpiderMonkey会将解译过的指令暂存，以提高性能，称为实时编译），但由于V8的核心部份多数用Javascript撰写（而SpiderMonkey是用C++）。
因此，在不同的测试上，两者性能互有优劣。与其相对应的是编译语言，例如C语言，以编译语言编写的程序在运行之前，必须经过编译，将代码编译为机器码，再加以运行。
参考资料：javascript_百度百科
网页设计如何设置网页部分内容不随着滚动条而移动移动
div的样式中使用相当于浏览器窗口定位——position:fixed。一、position:fixed属性的含义fixed：生成绝对定位的元素，相对于浏览器窗口进行定位。元素的位置通过 “left“, “top“, “right“ 以及 “bottom“ 属性进行规定。我们平时所说的固定定位指的就是fixed，设置了固定定位的元素不会随滚动条上下滚动。二、一般的 position:fixed; 实现方法#top{position:fixed;bottom:0;right:20px}实现了id为top的元素固定在浏览器的底部和距离右边20个像素的位置#top{position:fixed;top:20px;right:20px}实现了id为top的元素固定在距离浏览器的顶部20个像素和距离右边20个像素的位置三、IE6下position:fixed; 实现方法在IE6中是不能直接使用 position:fixed; 。你需要一些 CSS Hack 来解决它相同的还是让 《div id=“top“》...《/div》 元素固定在浏览器的底部和距离右边的20个像素，这次的代码是：#top{position:fixed;bottom:0;right:20px;_position:absolute;_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));}right 跟 left 属性可以用绝对定位的办法解决，而 top 跟 bottom 就需要用上面的表达式来实现。其中在_position:absolute; 中的 _ 符号只有 IE6 才能识别，目的是为了区分其他浏览器1、使元素固定在浏览器窗口的顶部：#top{_position:absolute;_top:expression(eval(document.documentElement.scrollTop));}2、使元素固定距浏览器窗口的顶部a像素的位置：#top{_position:absolute;_top:expression(eval(document.documentElement.scrollTop));_margin-top:a;}或者#top{_position:absolute;_top:expression(eval(document.documentElement.scrollTop+a));}3、使元素固定在浏览器窗口的底部：#top{_position:absolute;_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));}4、使元素固定在距浏览器窗口的底部b像素的位置：#top{_position:absolute;_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));_margin-bottom:b;}或者#top{_position:absolute;_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||b)-(parseInt(this.currentStyle.marginBottom,10)||b)));}四、IE6下的闪动问题问题还没有完全解决。在用了上面的办法后，你会发现：被固定定位的元素在滚动滚动条的时候会闪动。解决闪动问题的办法是在 CSS 文件中加入：*html{background-image:url(about:blank);background-attachment:fixed;}其中 * html选择器hack是给 IE6 识别的。到此，IE6 的 position:fixed; 问题已经被解决了
currentstyle 属性的作用是什么
该属性是一个对象，也是计算后的样式的属性值对的集合。为了兼容性我们可以将其封装改写一下，提供一个统一的方法getCurrentStyle(node)，如下：
function getCurrentStyle(node) {
var style = null;
if(window.getComputedStyle) {
style = window.getComputedStyle(node, null);
}else{
style = node.currentStyle;
}
return style;
}
织梦currentstyle调用的css在哪里
其实呀，跟普通调用一样，无非多了一些路劲参数，建议去看看它默认的路劲调用方法，改改就能用了。举个例子哦，这是默认的主页的css文件调用的写法，《link href=“{dede:global.cfg_templets_skin/}/style/dedecms.css“ rel=“stylesheet“ media=“screen“ type=“text/css“ /》，分析一下，调用的css文件就在stye文件夹里，然后你就可以做个试验用自己的主页模板替换原来默认的，然后把css文件放到相应的文件夹内，调用的时候《link href=“{dede:global.cfg_templets_skin/}/style/dedecms.css“ rel=“stylesheet“ media=“screen“ type=“text/css“ /》里的dedecms.css换掉就可以了吧，试试。js嘛都一样。模板是用来干嘛的啊？就是用来简化你书写的代码量的啊，好好利用起来。
style=“text-decoration:underline;“是什么意思
style=“text-decoration:underline;“ 就是设置文字修饰方式为下划线。
style=“text-decoration:除了underline还可以有以下取值：
1、none: 默认值。无装饰
2、blink: 闪烁
3、line-through: 贯穿线
4、overline: 上划线
扩展资料：
text-decoration检索或设置对象中的文本的装饰规则：
有href特性的a，以及u，ins对象默认值为underline。对象strike，s，del，默认值是line-through。
假如none值在属性声明的最后，所有的先前的其他取值都会被清除。例如，声明text-decoration:underline overline blink none等于声明text-decoration:none。假如对象没有文本(如img元素)或者是空元素(如：)，此属性不会发生作用。
假如你设置body对象的此属性值为none，a对象将依然保持其原有的下划线样式。除非你针对a对象声明此属性值。指定块对象的此属性将影响其所有内联子对象。而此影响一旦发生，块对象容器最终会受到影响。
在IE4+中可用的值为overline和blink。虽然blink值被提供，但它不会被作用。此属性对于currentStyle对象而言是只读的。对于其他对象而言是可读写的。对应的脚本特性为textDecoration。
示例：div{text-decoration:underline;}；div{text-decoration:underlineoverline;}。
参考资料来源：百度百科-text-decoration
JavaScript是如何改变网页的CSS样式的
通常我们将网页的样式和内容分开，样式放在css文件，内容放在html文件，当html文件需要用到样式的时候，直接引用css中定义的样式就可以了。其实JavaScript也能使用css文件或直接改变样式的属性来动态的改变网页的样式。 1、JavaScript设置内联样式改变样式最直接的方法就是改变元素节点的style属性。如： myElement.sytle.color = “red”;myElement.sytle.left = “40px”;myElement.sytle.backgroundRepeat = “repeat-x”; JavaScript设置内联样式时，采用和css设置样式一样的风格。如设置myElement的color属性时，我们可以赋值任何在css中可以用的值，所以这里除了可以使用”red”，还可以使用”blue”, ”yellow”或十六进制的”#ff0000”。另外用JavaScript改变网页的属性还需要注意2点：l JavaScript中采用驼峰命名法：在css中，属性名中的单词之间是用横杠隔开，如font-weight, background-color。但在JavaScript中，横杠可能被认为是减号，所以采用驼峰命名法，单词之间不用横杠，如font-weight在JavaScript中应该写成fontWeight;而background-color写成backgroundColor。l JavaScript中属性值为字符串：在css中，属性值都写在双引号中，即要用字符串来给css相关属性赋值，同样当属性值有单位时，我们需要将单位也写在字符串中。 2、JavaScript设置外部样式当你需要改变的样式已经在css文件中定义了，我们也可以用JavaScript直接用定义好的css样式。如下格式： myElement.className = “someCSSclass”; 同样需要注意几点：l 不要将className写成class，因为class是JavaScript保留的关键字，我们不能使用。l 将定义在css中的样式直接赋值给className，就能改变myElement元素的样式。l 当要删除元素的样式，可以给className属性赋值为空。如：myElement.className = “”;教程网 站-秒秒学上的JavaScript课程有一个章节专门讲解JavaScript改变样式的内容，可以看看，希望对你有帮助。
如何在DataGrid里面产生滚动条而不滚动题头
我们在开发的时候一定遇到，使用DataGrid的时候由于不想分页（数据没有那么多）但是又显示不在一页里面，此时我们希望在DataGrid里面出现一个滚动条，可以上下滚动DataGrid里面的数据而不用上下滚动页面，由于写本文的目的是为了说明如何实现，所以对于细节性的问题读者可以自己思考完成（比如：既要分页又要滚动等等）。为了可以滚动DataGrid我们需要一个可以让客户端的Table滚动js脚本（该js代码我是从CodeProject上面下载的），但又不能滚动Table的题头（也就是第一行）。我们都知道DataGrid在解释到客户端以后将会生成一个Table，但是这个Table是由《tr》《td》组成的，我们的脚本里面是需要使用到Table的Thead和Tbody的（在大多数的客户端的应用中都要用到此功能比如：客户端的排序、以及列的托拽等等），因此我们接下来的任务就是如何为我们客户端的这个DataGrid添加《thead》《tbody》了。如果你对用户的自定义控件以及ASP.NET页面的原理有所了解，我们知道控件最后都是要呈现(Render)在页面上的，因此我们可以重写这个方法来完成DataGrid的自定义呈现。听一听真的有些吓人，那么复杂的控件怎么呈现？不要着急，首先我们创建一个自定义控件如下所示：public class PowerDataGrid : System.Web.UI.WebControls.DataGrid 由此可以看出我们的控件是继承于DataGrid的，所以我们现在的这个控件在不用写一行代码的情况下我们的这个控件已经具有DataGrid的所有的功能。接下来我们要将我们准备的js代码内嵌到我们的控件里，好让放这个控件的页面上最终在客户端都会有这段js代码用来完成我们滚动的任务。为了完成这个工作我们要重写预呈现的方法： protected override void OnPreRender(System.EventArgs e) { base.OnPreRender(e); ResourceManager manager = new ResourceManager( this.GetType() ); ResourceSet resources = manager.GetResourceSet(System.Globalization.CultureInfo.CurrentCulture, true, true); if( !Page.IsClientScriptBlockRegistered( “SkySword.WebControl.PowerDataGrid Library“ ) ) { String script = resources.GetString(“ScrollTable“); this.Page.RegisterClientScriptBlock(“SkySword.WebControl.PowerDataGrid Library“, script ); this.Page.RegisterStartupScript(“SkySword.WebControls.PowerDataGrid Init“, “《script》makeScrollableTable(’“+this.ID+“’,true,’auto’);《/script》“ ); } } 在该方法中我们访问了资源文件。哦！忘了说我们还要建立一个资源文件，用来保存我们的js代码。我们首先将资源代码中对应ScrollTable的数据（一段js脚本）注册到客户端的脚本块里。最后我们为了可以初始化，将《script》makeScrollableTable(’“+this.ID+“’,true,’auto’);《/script》段脚本注册到页面加载时开始执行（我想就应该和body里面onload的方法一样吧）。当你需要加载客户端脚本的时候使用该方法是个不错的选择。好了，客户端脚本也有了，剩下的就是处理我们的客户端DataGrid了（也就是DataGrid呈现的客户端Table）。为了可以呈现我们自己的DataGrid我们需要重写呈现方法如下所示：protected override void Render(HtmlTextWriter output) { output.Write(this.parseMarkup()); } 其中调用了一个parseMarkup的函数，改函数将产生一个输出的脚本（字符串），该脚本就是一个包含thead和tbody的Table。由于此方法只是由该控件自己使用所以我们将它设置成私有的代码如下： private string parseMarkup(){ // 插入THead标签和TBody标签 StringWriter writer = new StringWriter(); HtmlTextWriter buffer = new HtmlTextWriter(writer); base.Render(buffer); string pMarkup = writer.ToString(); // 找到第一个table标签的结尾也就是第一个》字符 pMarkup = pMarkup.Insert(pMarkup.IndexOf(“》“) + “》“.Length, “《thead》“); // 将第一个tr闭区间用Thead包起来，现在第一个《thead》已经画出来了需要画 // 它的结尾《/thead》和《/tbody》,同样找到第一个《/tr》来插入《/thead》和《/tdoby》 pMarkup = pMarkup.Insert( pMarkup.IndexOf(“《/tr》“) + “《/tr》“.Length,“《/thead》《tbody》“); // 在最后一个《/table》的前面插入一个《/tbody》就可以了。 pMarkup = pMarkup.Replace(“《/table》“, “《/tbody》《/table》“); return pMarkup; } 在这个方法中我们首先实例化了一个StringWriter的对象writer，又用该对象为参数实例了一个HtmlTextWriter对象buffer，最关键的是我们调用了基类的Render用来将buffer里面填满要输出的东西（一堆脚本就是Table，如果你是用监视器查看里面的内容就可以看到）。好了剩下的工作就是分析这个脚本了，然后我们在该脚本第一个出现《tr》的地方将这个《tr》替换成《thead》和《tr》后面的替换方法类似。最后我们将这个被我们替换和修改的Table输出到客户端，一切OK！注意：用到StringWriter的原因就是它可以从buffer里面保存原始的字符比如：/t/n什么的。 资源文件的配置方法：首先给你的工程添加一个资源文件，名字和你的控件一样，然后在该文件中添加一下小节 《data name=“ScrollTable“》 《value》《![CDATA[ 《script language = ’javascript’》 var container = new Array();var onResizeHandler;function scrollbarWidth(){ var w; if (! document.body.currentStyle) document.body.currentStyle = document.body.style; if (document.body.currentStyle.overflowY == ’visible’ || document.body.currentStyle.overflowY == ’scroll’){ w = document.body.offsetWidth - document.body.clientLeft - document.body.clientWidth; }else{ win = window.open(“about:blank“, “_blank“, “top=0,left=0,width=100,height=100,scrollbars=yes“); win.document.writeln(’scrollbar’); w = win.document.body.offsetWidth - win.document.body.clientLeft - win.document.body.clientWidth; win.close(); } return w;}function getActualWidth(e){ if (! e.currentStyle) e.currentStyle = e.style; return e.clientWidth - parseInt(e.currentStyle.paddingLeft) - parseInt(e.currentStyle.paddingRight);}function findRowWidth(r){ for (var i=0; i 《 r.length; i++){ r[i].actualWidth = getActualWidth(r[i]); }}function setRowWidth(r){ for (var i=0; i 《 r.length; i++){ r[i].width = r[i].actualWidth; r[i].innerHTML = ’《span style=“width:’ + r[i].actualWidth + ’;“》’ + r[i].innerHTML + ’《/span》’; }}function fixTableWidth(tbl){ for (var i=0; i 《 tbl.tHead.rows.length; i++) findRowWidth(tbl.tHead.rows[i].cells); findRowWidth(tbl.tBodies.rows.cells); if (tbl.tFoot) for (var i=0; i 《 tbl.tFoot.rows.length; i++) findRowWidth(tbl.tFoot.rows[i].cells); //tbl.width = ’’; for (var i=0; i 《 tbl.tHead.rows.length; i++) setRowWidth(tbl.tHead.rows[i].cells); setRowWidth(tbl.tBodies.rows.cells); if (tbl.tFoot) for (var i=0; i 《 tbl.tFoot.rows.length; i++) setRowWidth(tbl.tFoot.rows[i].cells);}function makeScrollableTable(tbl,scrollFooter,height){ var c, pNode, hdr, ftr, wrapper, rect; if (typeof tbl == ’string’) tbl = document.getElementById(tbl); pNode = tbl.parentNode; fixTableWidth(tbl); c = container.length; container[c] = document.createElement(’《SPAN style=“height: 100; overflow: auto;“》’); container[c].id = tbl.id + “Container“; pNode.insertBefore(container[c], tbl); container[c].appendChild(tbl); container[c].style.width = tbl.clientWidth + 2 * tbl.clientLeft + scrollbarWidth(); hdr = tbl.cloneNode(false); hdr.id += ’Header’; hdr.appendChild(tbl.tHead.cloneNode(true)); tbl.tHead.style.display = ’none’; if (!scrollFooter || !tbl.tFoot){ ftr = document.createElement(’《SPAN style=“width:1;height:1;clip: rect(0 1 1 0);background-color:transparent;“》’); ftr.id = tbl.id + ’Footer’; ftr.style.border = tbl.style.border; ftr.style.width = getActualWidth(tbl) + 2 * tbl.clientLeft; ftr.style.borderBottom = ftr.style.borderLeft = ftr.style.borderRight = ’none’; }else{ ftr = tbl.cloneNode(false); ftr.id += ’Footer’; ftr.appendChild(tbl.tFoot.cloneNode(true)); ftr.style.borderTop = ’none’; tbl.tFoot.style.display = ’none’; } wrapper = document.createElement(’《table border=0 cellspacing=0 cellpadding=0》’); wrapper.id = tbl.id + ’Wrapper’; pNode.insertBefore(wrapper, container[c]); wrapper.insertRow(0).insertCell(0).appendChild(hdr); wrapper.insertRow(1).insertCell(0).appendChild(container[c]); wrapper.insertRow(2).insertCell(0).appendChild(ftr); wrapper.align = tbl.align; tbl.align = hdr.align = ftr.align = ’left’; hdr.style.borderBottom = ’none’; tbl.style.borderTop = tbl.style.borderBottom = ’none’; // adjust page size if (c == 0 && height == ’auto’){ onResizeAdjustTable(); onResizeHandler = window.onresize; window.onresize = onResizeAdjustTable; }else{ container[c].style.height = height; }}function onResizeAdjustTable(){ if (onResizeHandler) onResizeHandler(); var rect = container.getClientRects()(0); var h = document.body.clientHeight - (rect.top + (document.body.scrollHeight - rect.bottom)); container.style.height = (h 》 0) ? h : 1;}function printPage(){ var tbs = document.getElementsByTagName(’TABLE’); var e; for (var i=0; i 《 container.length; i++) container[i].style.overflow = ’’; window.print(); for (var i=0; i 《 container.length; i++) container[i].style.overflow = ’auto’;} 《/script》 ]]》《/value》 《/data》
css样式怎么调用
CSS是一门指定文档该如何呈现给用户的语言。
一、CSS帮助您将文档信息的内容和如何展现它的细节相分离
创建html文档
创建样式表
在与前面相同的目录中，新建另一个文本文件。该文件将成为您的样式表。请将它命名为：style1.css
在您的CSS文件中，复制、粘贴下面的行，并保存该文件:
二、连接您的文档和样式表
为将您的文档和样式表相连，请编辑您的HTML文件。并添加下面高亮的行：
保存该文件并刷新您的浏览器。该样式表将首字母显示为红色，如下所示：
三、rel=“stylesheet”是什么意思呢
范例中呈现的是标准HTML 《link》标签嵌入css档案的写法，其中「rel=“stylesheet“ type=“text/css“」所代表的意思，就是告诉浏览器要导入一个在外部的css档案，透过href导入名为xxxx.css的样式档案。