動態產生超連結底線

.動態超連結 {

    text-decoration: none;

}

.動態超連結:hover {

    text-decoration: underline;

} 

<a class="動態超連結" href="...">...</a>

網址參數加密

網址: https://aaa.com/controller/?參數1&參數2

加密後參數=Server.UrlEncode(參數.aesEncryptBase64(key))

解密後參數=Request.QueryString[0].aesDecryptBase64(key)

參數1=解密後參數.Split('&')[0]

參數2=解密後參數.Split('&')[1]

※加密使用AES

public static string aesEncryptBase64(this string SourceStr, string CryptoKey)

        {

            string encrypt = "";

            AesCryptoServiceProvider aes = new AesCryptoServiceProvider();

            MD5CryptoServiceProvider md5 = new MD5CryptoServiceProvider();

            SHA256CryptoServiceProvider sha256 = new SHA256CryptoServiceProvider();

            byte[] key = sha256.ComputeHash(Encoding.UTF8.GetBytes(CryptoKey));

            byte[] iv = md5.ComputeHash(Encoding.UTF8.GetBytes(CryptoKey));

            aes.Key = key;

            aes.IV = iv;

            byte[] dataByteArray = Encoding.UTF8.GetBytes(SourceStr);

            using (MemoryStream ms = new MemoryStream())

            using (CryptoStream cs = new CryptoStream(ms, aes.CreateEncryptor(), CryptoStreamMode.Write))

            {

                cs.Write(dataByteArray, 0, dataByteArray.Length);

                cs.FlushFinalBlock();

                encrypt = Convert.ToBase64String(ms.ToArray());

            }

            return encrypt;

        }

        public static string aesDecryptBase64(this string SourceStr, string CryptoKey)

        {

            string decrypt = "";

            AesCryptoServiceProvider aes = new AesCryptoServiceProvider();

            MD5CryptoServiceProvider md5 = new MD5CryptoServiceProvider();

            SHA256CryptoServiceProvider sha256 = new SHA256CryptoServiceProvider();

            byte[] key = sha256.ComputeHash(Encoding.UTF8.GetBytes(CryptoKey));

            byte[] iv = md5.ComputeHash(Encoding.UTF8.GetBytes(CryptoKey));

            aes.Key = key;

            aes.IV = iv;

            byte[] dataByteArray = Convert.FromBase64String(SourceStr);

            using (MemoryStream ms = new MemoryStream())

            {

                using (CryptoStream cs = new CryptoStream(ms, aes.CreateDecryptor(), CryptoStreamMode.Write))

                {

                    cs.Write(dataByteArray, 0, dataByteArray.Length);

                    cs.FlushFinalBlock();

                    decrypt = Encoding.UTF8.GetString(ms.ToArray());

                }

            }

            return decrypt;

        }

讓元素寬度自動設為剩餘可用寬度

<div style="display:flex">

<input type="text" style="width:4em">

<select style="flex-grow:1;flex-basis: 0;"></select> 
</div>

下拉選單寬度會等於div 扣除input 後剩餘寬度 (不可設定 width 否則會失效)

若要讓高度設為剩餘可用高度

<div style="height: 100%; display: flex; flex-direction: column;">

  <div>123</div>

  <div style="flex-grow: 1; flex-basis: 0;">剩餘可用高度</div>

</div>

參考來源

UI Bootstrap Datepicker 和其他物件垂直置中方法

<table><tr >

<td>日期範圍 </td>

<td><span class="input-group" style="display:inline-block;width:125px;margin-bottom:-5px"><input runat="server" id="fromdate" uib-datepicker-popup="yyyy/MM/dd" ui-mask="9999/99/99" model-view-value="true" is-open="popup1.opened" type='tel' class='form-control' style="width: 90px;" ng-model="fromdate"><span class="input-group-btn"><button type="button" class="btn btn-default" ng-click="popup1.opened=true" title="選擇日期"><i class="far fa-calendar"></i></button></span></span></td>

<td>~</td>

<td> <span class="input-group" style="display:inline-block;width:125px;margin-bottom:-5px"><input runat="server" id="todate" uib-datepicker-popup="yyyy/MM/dd" ui-mask="9999/99/99" model-view-value="true" is-open="popup2.opened" type='tel' class='form-control' style="width: 90px;" ng-model="todate"><span class="input-group-btn"><button type="button" class="btn btn-default" ng-click="popup2.opened=true" title="選擇日期"><i class="far fa-calendar"></i></button></span></span></td>

<td> <button class="btn btn-default">查詢</button></td>

</tr></table>

※透過 table td 區隔各元素達到垂直置中

※針對 input-group 設定 margin-bottom:-5px 避免垂直偏差

※針對 input-group 設定 display:inline-block;width:125px 避免轉折