CSS代码翻译

html-css012

CSS代码翻译,第1张

body {/*设置body整体样式*/

background-color: #DCDCDC /*背景色*/

font-family: Arial, Helvetica, sans-serif/*字体*/

font-size: 12px/*字体大小*/

line-height: 24px/*文字行高*/

color: #336699/*字体颜色*/

}

td, th { /*设置所有表格中td th样式 以下属性同body一样解释*/

font-family: Arial, Helvetica, sans-serif

font-size: 12px

line-height: 24px

color: #333333

}

a { /*设置链接样式*/

color: #3366CC

text-decoration: none /*无下划线*/

}

form { /*表单样式*/

background-color: #CCCC99

}

.title { /*设置类名为title的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 24px

line-height: 30px

background-color: #006666

color: #DCDCDC

}

.subtitle {/*设置类名为subtitle的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 16px

line-height: 22px

font-weight: bold/*字体粗细*/

color: #006666

}

.header {/*设置类名为header的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 24px

background-color: #006666

color: #DCDCDC

}

.nav { /*设置类名为nav的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 14px

font-weight: bold

background-color: #CCCCCC

}

.navLink { /*设置类名为navLink的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 14px

font-weight: bold

background-color: #DEDECA

}

.sidebar { /*设置类名为sidebar的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 12px

line-height: 18px

padding: 3px /*内补白为3像素*/

background-color: #FFFFFF

}

.sidebarHeader { /*设置类名为sidebarHeader的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 16px

line-height: 24px

color: #FFFFFF

background-color: #339999

}

.sidebarFooter { /*设置类名为sidebarFooter的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 12px

line-height: 18px

background-color: #CCCCCC

}

.footer { /*设置类名为footer的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 14px

font-weight: bold

line-height: 22px

color: #333333

background-color: #CCCCCC

}

.legal { /*设置类名为legal的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 9px

color: #333333

}

.box1 { /*设置类名为box1的元素边框样式 */

border-color: #CCCCCC #333333 #333333 #CCCCCC /*边框的上 右 下 左依次对应的颜色*/

border-width: medium/*边框粗细*/

border-style: ridge/*边框风格*/

}

.promo { /*设置类名为promo的元素样式 */

font-family: "Times New Roman", Times, serif

color: #000033

}

.titlebar { /*设置类名为titlebar的元素样式 */

font-family: "Times New Roman", Times, serif

font-size: 9px

color: #FFFFFF

background-color: #336699

}

.dingbat { /*设置类名为dingbat的元素样式 */

font-family: Arial, Helvetica, sans-serif

background-color: #99CC99

color: #006666

font-weight: bolder

font-size: medium

}

a:hover { /*设置当鼠标移上时候的链接样式 */

text-decoration: underline

}

input.big { /*设置input元素中类名为big的样式 */

width: 100px /*宽*/

}

input.small { /*设置input元素中类名为small的样式 */

width: 50px

}

在移动端webview渲染的时候,html标签会被自动加入一个class属性,会标识不同的设备

如:

所以,可以用来适配一些移动双端的差异场景,如适配不同高度Titlebar

不同样式:

使用样式:

在iOS设备上就会展示80px,Android设备上60px

它是打开 jQuery 用户界面对话框的标题栏不可能吗?谢谢! 解决方法 1: 我认为最好的办法是使用选项 dialogClass。Jquery UI 文档的摘录:在初始化:$('.selector').dialog({ dialogClass: 'alert' })或者,如果您要初始化后。: $('.selector').dialog('option', 'dialogClass', 'alert')所以我用 dialogClass 选项创建一些对话框的 = 'noTitleStuff' 和 css 像这样:.noTitleStuff .ui-dialog-titlebar {display:none} 太简单了!但我想为什么我以前的 id->钻井方法的类不工作的 1 天。事实上调用.dialog() 方法时您转换的 div 成为儿童的另一个 div (的真正对话框的 div) 和可能是 '兄弟' 的标题栏 div 中,所以很难找后者起前。 解决方法 2: 我相信,你便可以将其隐藏,用 css:.ui-dialog-titlebar { display:none} 或者,具体到某个特定的项:div#example .ui-dialog-titlebar { display:none} 签出"主题"对话框。我不相信有不呈现的标题栏不幸的是,一个对话框选项。 解决方法 3: 我想出动态删除标题栏的修补程序。$("#example").dialog(dialogOpts)// remove the title bar $(".ui-dialog-titlebar").hide()呈现对话框后,这将删除所有元素与类 ' ui-对话框的标题栏。 解决方法 4: 尝试此操作$"(# ui-dialog-title-divid").parent().hide() ;按相应的 id 替换"得思" 解决方法 5: 我在我的项目中使用该$("#myDialog").dialog(dialogOpts)// remove the title bar $("#myDialog").siblings('div.ui-dialog-titlebar').remove()// one liner $("#myDialog").dialog(dialogOpts).siblings('.ui-dialog-titlebar').remove() 解决方法 6: 若要隐藏标题栏后初始化对话框时使用 dialogClass,可以使用 jquery。在初始化:$('.selector).dialog ({ dialogClass: 'yourclassname' })$('.yourclassname div.ui-dialog-titlebar').hide() ;通过使用此方法,您不需要更改您的 css 文件,和这也是动态的。 解决方法 7: 其实还有另一种方法做这件事,使用该对话框 '构件' 直接:因此你可以在对话框构件$"(# example").dialog(dialogOpts) ;$dlgWidget = $('# example').dialog('widget') ;然后执行$ dlgWidget.find(".ui-dialog-titlebar").hide() ;若要隐藏该对话框仅在标题栏在一行代码 (我喜欢链接):$('# example').dialog('widget').find(".ui-dialog-titlebar").hide() ;无需额外的类添加到对话框的这种方式,只是去看它直接。Workss 对我来说太好。 解决方法 8: 这工作对我来说 ……

$("#dialog").dialog ({

创建: {功能用户界面事件)

}, 解决方法 9: 我发现时隐藏对话框的标题栏的一件事,即使显示为无,屏幕阅读器仍把它捡起来,将读取它。如果您已经添加您自己的标题栏,它将读取都造成混乱。我做的事删除它从 DOM 使用 $(selector).remove()。现在屏幕阅读器 (和其他人一样) 不会看到它因为它不再存在。 解决方法 10: 嗯,没有一个答案解决它首先呈现到页的多余标记的事实。也许真正的答案是不同的插件或重写。