首頁 web前端 html教學 DIV+CSS备录_html/css_WEB-ITnose

DIV+CSS备录_html/css_WEB-ITnose

Jun 24, 2016 pm 12:32 PM

#属性篇:

1滚动条的样式

*控制横向和纵向滚动条的显隐

去掉滚动条 y 轴

­

去掉滚动条 x 轴

­

滚动条 x/y 轴全部去掉

­

*滚动条颜色

Scrollbar-Face-Color为滚动条表面颜色设定; ­

Scrollbar-Highlight-Color为滚动条上斜面和左斜面颜色设定; ­

Scrollbar-Shadow-Color为滚动条下斜面和右斜面颜色设定; ­

Scrollbar-3Dlight-Color为滚动条上边和左边的边沿颜色设定; ­

Scrollbar-Arrow-Color为滚动条两端箭头颜色设定。 ­

Scrollbar-Track-Color为滚动条底板颜色设定; ­

Scrollbar-Darkshadow为滚动条下边和右边边沿颜色设定。

2.marquee滚动

direction 表示滚动的方向,值可以是left,right,up,down,默认为left ­

behavior 表示滚动的方式,值可以是scroll(连续滚动)slide(滑动一次)alternate(来回滚动) ­

loop 表示循环的次数,值是正整数,默认为无限循环 ­

scrollamount 表示运动速度,值是正整数,默认为6 ­

scrolldelay 表示停顿时间,值是正整数,默认为0,单位是毫秒 ­

align 表示元素的垂直对齐方式,值可以是top,middle,bottom,默认为middle ­

bgcolor 表示运动区域的背景色,值是16进制的RGB颜色,默认为白色 ­

height、width 表示运动区域的高度和宽度,值是正整数(单位是像素)或百分数,默认width=100% height为标签内元素的高度 ­

hspace、vspace 表示元素到区域边界的水平距离和垂直距离,值是正整数,单位是像素。 ­

onmouseover=this.stop() onmouseout=this.start() 表示当鼠标以上区域的时候滚动停止,当鼠标移开的时候又继续滚动。

 3.网页?嵌框架 iframe

  

marginheight:上下/左右边界

frameborder:边框

align:对齐

scrolling:滚动轴

 name:命名

allowTransparency:是否透明 

 4.Windows Media Player 网页播放器 参数含义(MediaPlayer9.0以上)

//播放的文件地址
//是否自动播放
//调整左右声道平衡,同上面旧播放器代码
//播放器是否可人为控制
//是否启用上下文菜单
//播放次数控制,为整数
//播放速率控制,1为正常,允许小数,1.0-2.0
//控件设置当前位置
//控件设置:当前标记
//显示默认框架
//脚本命令设置:是否调用URL
  //脚本命令设置:被调用的URL
//是否按比例伸展
//默认声音大小0%-100%,50则为50%
//是否静音
//播放器显示模式:Full显示全部;mini最简化;None不显示播放控制,只显示视频窗口;invisible全部不显示
//如果是0可以允许全屏,否则只能在窗口中查看
//开始播放是否自动全屏
//是否启用错误提示报告
//SAMI样式
//SAMI语言
//字幕ID

#技巧篇:

1.在dreamweaver中让flash背景透明

把原参数改为: ­

2.CSS背景半透明效果

*在CSS里加入:filter: Alpha(Opacity=50); ­//数字代表透明程度

*如果想背景半透明,而文字不透明,可以在文字层加入position:relative ;

3.去掉链接图片点击时的虚线边框

 ­在a标签加onFocus="if(this.blur)this.blur()"就可以了

4.鼠标经过时的换行解释

在二行之间加

如:title=" 酷站名称:bbcafe 添加日期:2009-6-7"

5.文本格式化

*不换行

WHITE-SPACE ­

normal :  默认处理方式 ­

pre :  用等宽字体显示预先格式化的文本。不合并字间的空白距离和进行两端对齐。 ­

nowrap :  强制在同一行内显示所有文本,直到文本结束或者遭遇br对象。

*自动换行

word-break:break-all;

word-wrap: break-word; /*不拆分单词换行*/

*自动二端对齐

text-align:justify;

text-justify:inter-ideograph;

*字符和单词的间距

letter-spacing/*字符间距*/ ­

word-spacing/*单词间距*/ ­

*文本超出时显示为省略号

text-overflow:ellipsis;

6.fieldset 标签的用法

fieldset 元素可将表单内的相关元素分组。

如:

­

item: ­

­

­

­

­

­

显示结果:

7.页面退出时的渐隐效果 

加在head 之间 ­

­//数字代码渐隐速度

8.favicon.ico 显示­

­

9.使网页另存为失效

在BODY之间加入以下代码 ­

­

­

10.让IE8自动启动IE7兼容模式

在页面中加入如下HTTP meta-tag: ­

­

 

 12.图片自适应层高度

 

只能在固定的层高度适应

#浏览器兼容(hack)

*区别IE6与FF:

background:orange;_background:blue;  
*区别IE6与IE7: (IE6能识别_, 而IE7不能) 
background:orange; *background:green;  
*区别FF,IE7,IE6:(IE6 IE7能识别*,FF不能识别)  
background:orange; *background:green; _background:blue;  

(IE6能识别_,IE7,FF不能;IE7能识别*,FF不能) 

\0\9区别于IE8与FF(IE8能识别\0或\9,IE6 7 8能识别\0,FF不能识别)

background:orange\9; background:orange\0;

*注:书写的顺序都是firefox的写在前面,IE7的写在中间,IE6的写在后面 IE8写在最后面。  

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

<🎜>:泡泡膠模擬器無窮大 - 如何獲取和使用皇家鑰匙
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
北端:融合系統,解釋
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
Mandragora:巫婆樹的耳語 - 如何解鎖抓鉤
3 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1665
14
CakePHP 教程
1424
52
Laravel 教程
1322
25
PHP教程
1270
29
C# 教程
1249
24
了解HTML,CSS和JavaScript:初學者指南 了解HTML,CSS和JavaScript:初學者指南 Apr 12, 2025 am 12:02 AM

WebDevelovermentReliesonHtml,CSS和JavaScript:1)HTMLStructuresContent,2)CSSStyleSIT和3)JavaScriptAddSstractivity,形成thebasisofmodernWebemodernWebExexperiences。

HTML:結構,CSS:樣式,JavaScript:行為 HTML:結構,CSS:樣式,JavaScript:行為 Apr 18, 2025 am 12:09 AM

HTML、CSS和JavaScript在Web開發中的作用分別是:1.HTML定義網頁結構,2.CSS控製網頁樣式,3.JavaScript添加動態行為。它們共同構建了現代網站的框架、美觀和交互性。

HTML,CSS和JavaScript的未來:網絡開發趨勢 HTML,CSS和JavaScript的未來:網絡開發趨勢 Apr 19, 2025 am 12:02 AM

HTML的未來趨勢是語義化和Web組件,CSS的未來趨勢是CSS-in-JS和CSSHoudini,JavaScript的未來趨勢是WebAssembly和Serverless。 1.HTML的語義化提高可訪問性和SEO效果,Web組件提升開發效率但需注意瀏覽器兼容性。 2.CSS-in-JS增強樣式管理靈活性但可能增大文件體積,CSSHoudini允許直接操作CSS渲染。 3.WebAssembly優化瀏覽器應用性能但學習曲線陡,Serverless簡化開發但需優化冷啟動問題。

HTML的未來:網絡設計的發展和趨勢 HTML的未來:網絡設計的發展和趨勢 Apr 17, 2025 am 12:12 AM

HTML的未來充滿了無限可能。 1)新功能和標準將包括更多的語義化標籤和WebComponents的普及。 2)網頁設計趨勢將繼續向響應式和無障礙設計發展。 3)性能優化將通過響應式圖片加載和延遲加載技術提升用戶體驗。

HTML與CSS vs. JavaScript:比較概述 HTML與CSS vs. JavaScript:比較概述 Apr 16, 2025 am 12:04 AM

HTML、CSS和JavaScript在網頁開發中的角色分別是:HTML負責內容結構,CSS負責樣式,JavaScript負責動態行為。 1.HTML通過標籤定義網頁結構和內容,確保語義化。 2.CSS通過選擇器和屬性控製網頁樣式,使其美觀易讀。 3.JavaScript通過腳本控製網頁行為,實現動態和交互功能。

HTML:建立網頁的結構 HTML:建立網頁的結構 Apr 14, 2025 am 12:14 AM

HTML是構建網頁結構的基石。 1.HTML定義內容結構和語義,使用、、等標籤。 2.提供語義化標記,如、、等,提升SEO效果。 3.通過標籤實現用戶交互,需注意表單驗證。 4.使用、等高級元素結合JavaScript實現動態效果。 5.常見錯誤包括標籤未閉合和屬性值未加引號,需使用驗證工具。 6.優化策略包括減少HTTP請求、壓縮HTML、使用語義化標籤等。

HTML與CSS和JavaScript:比較Web技術 HTML與CSS和JavaScript:比較Web技術 Apr 23, 2025 am 12:05 AM

HTML、CSS和JavaScript是構建現代網頁的核心技術:1.HTML定義網頁結構,2.CSS負責網頁外觀,3.JavaScript提供網頁動態和交互性,它們共同作用,打造出用戶體驗良好的網站。

HTML:是編程語言還是其他? HTML:是編程語言還是其他? Apr 15, 2025 am 12:13 AM

HTMLISNOTAPROGRAMMENGUAGE; ITISAMARKUMARKUPLAGUAGE.1)htmlStructures andFormatSwebContentusingtags.2)itworkswithcsssforstylingandjavascript for Interactivity,增強WebevebDevelopment。

See all articles