zoukankan      html  css  js  c++  java
  • react-native样式引入

         react-native

         第一种:在标签内部使用样式

          

    import React from 'react';
    class Demo extends React.Component{
        render(){
            return(
                 <div>
                     <div
                         style={{
                           '100px',
                           height:'80px',
                           backgroundColor:'red',
                           fontSize:'24px',
                           textAlign:'center'
                           }}
                    >Demo!</div>
    
                   );
              }
           }
    export default 
    Demo;

    2、将style看做一个对象,然后进行引入

          

    import React from 'react';
    
    class Demo extends React.Component{
              render(){
                 let mystyle={
                     '200px',
                     height:'80px',
                     backgroundColor:'yellow',
                     fontSize:'24px',
                     textAlign:'center'
                  }
            return(
                <div>
                      <div style={mystyle}>This is Page1!</div>
                </div>
              );
                }
           }
    
    export default Demo;

    3、外部引入css文件

    #mydiv{
    200px;
    height:80px;
    background-color:yellow;
    font-size:24px;
    text-align:center
    }
    import React from 'react';
    require('./style.css');
    
    class Demo extends React.Component{
             render(){
                return(
                     <div>
                         <div id='mydiv'>This is Page1!</div>
                     </div>
                 );
             }
       }
    
    export default Demo;
  • 相关阅读:
    MySQL官方文档-二级索引覆盖主键索引
    windows server 2008/win7 远程控制
    博客园美化日记
    MarkDown 中使用 LaTeX 数学式
    DOS命令和bat脚本
    数据链路层
    网络安全
    运输层安全协议SSL
    DNS/域名
    停止等待协议
  • 原文地址:https://www.cnblogs.com/focusHots/p/11763449.html
Copyright © 2011-2022 走看看